• Python开发【前端】:JavaScript


    一、JavaScript的基础

    1、JS的引入方式

    1 直接编写
        <script>
            alert('hello yuan')
        </script>
    2 导入文件
        <script src="hello.js"></script>

    二、JavaScript常用数据类型

     2.1  变量

    JavaScript中变量的声明是一个非常容易出错的点,局部变量必须一个 var 开头,如果未使用var,则默认表示声明的是全局变量

    <script type="text/javascript">
      
        // 全局变量
        name = 'James';
      
        function func(){
            // 局部变量
            var age = 18;
      
            // 全局变量
            gender = "男"
        }
    </script
    

    2.2 数字  

    JavaScript中不区分整数值和浮点数值,JavaScript中所有数字均用浮点数值表示。

    转换:

    • parseInt(..)    将某值转换成数字,不成功则NaN
    • parseFloat(..) 将某值转换成浮点数,不成功则NaN

    特殊值:

    •  NaN,非数字。可使用 isNaN(num) 来判断。
    • Infinity,无穷大。可使用 isFinite(num) 来判断
    <script>
       //字符串转换为数字
        age="18";
        i = parseInt(age);
    </script>  

    更多数字计算

    常量
    
    Math.E
    常量e,自然对数的底数。
    
    Math.LN10
    10的自然对数。
    
    Math.LN2
    2的自然对数。
    
    Math.LOG10E
    以10为底的e的对数。
    
    Math.LOG2E
    以2为底的e的对数。
    
    Math.PI
    常量figs/U03C0.gif。
    
    Math.SQRT1_2
    2的平方根除以1。
    
    Math.SQRT2
    2的平方根。
    
    静态函数
    
    Math.abs( )
    计算绝对值。
    
    Math.acos( )
    计算反余弦值。
    
    Math.asin( )
    计算反正弦值。
    
    Math.atan( )
    计算反正切值。
    
    Math.atan2( )
    计算从X轴到一个点的角度。
    
    Math.ceil( )
    对一个数上舍入。
    
    Math.cos( )
    计算余弦值。
    
    Math.exp( )
    计算e的指数。
    
    Math.floor( )
    对一个数下舍人。
    
    Math.log( )
    计算自然对数。
    
    Math.max( )
    返回两个数中较大的一个。
    
    Math.min( )
    返回两个数中较小的一个。
    
    Math.pow( )
    计算xy。
    
    Math.random( )
    计算一个随机数。
    
    Math.round( )
    舍入为最接近的整数。
    
    Math.sin( )
    计算正弦值。
    
    Math.sqrt( )
    计算平方根。
    
    Math.tan( )
    计算正切值。
    
    Math  

     三、 运算符

    算术运算符:
        +   -    *    /     %       ++        -- 
    
    比较运算符:
        >   >=   <    <=    !=    ==    ===   !==
    
    逻辑运算符:
         &&   ||   !
    
    赋值运算符:
        =  +=   -=  *=   /=
    
    字符串运算符:
        +  连接,两边操作数有一个或两个是字符串就做连接运算
    

    3.1 算数运算符  

    注意1: 自加自减

    假如x=2,那么x++表达式执行后的值为3,x--表达式执行后的值为1;i++相当于i=i+1,i--相当于i=i-1;
    递增和递减运算符可以放在变量前也可以放在变量后:--i

    var i=10;
    console.log(i++);
    console.log(i);
    console.log(++i);
    console.log(i);
    console.log(i--);
    console.log(--i);
    

    注意2: 单元运算符

    - 除了可以表示减号还可以表示负号  例如:x=-y
     
    + 除了可以表示加法运算还可以用于字符串的连接  例如:"abc"+"def"="abcdef"
    

    注意3: NaN

    var d="yuan";
    d=+d;
    alert(d);//NaN:属于Number类型的一个特殊值,当遇到将字符串转成数字无效时,就会得到一个NaN数据
    alert(typeof(d));//Number
    
    //NaN特点:
        
    var n=NaN;
        
    alert(n>3);
    alert(n<3);
    alert(n==3);
    alert(n==NaN);
        
    alert(n!=NaN);//NaN参与的所有的运算都是false,除了!=
    

    3.2 比较运算符

    >   >=   <    <=    !=    ==    ===   !==
    

    用于控制语句时:

            if (2>1){       //  3  0  false null undefined []
                console.log("条件成立!")
            }
    

    等号和非等号的同类运算符是全等号和非全等号。这两个运算符所做的与等号和非等号相同,只是它们在检查相等性前,不执行类型转换。  

    console.log(2==2);
    console.log(2=="2");
    console.log(2==="2");
    console.log(2!=="2");
    

    注意1:  

    var bResult = "Blue" < "alpha";
    alert(bResult); //输出 true  
    在上面的例子中,字符串 "Blue" 小于 "alpha",因为字母 B 的字符代码是 66,字母 a 的字符代码是 97。
    
    比较数字和字符串
    
    另一种棘手的状况发生在比较两个字符串形式的数字时,比如:
    
    var bResult = "25" < "3";
    alert(bResult); //输出 "true"
    上面这段代码比较的是字符串 "25" 和 "3"。两个运算数都是字符串,所以比较的是它们的字符代码("2" 的字符代码是 50,"3" 的字符代码是 51)。
    
    不过,如果把某个运算数该为数字,那么结果就有趣了:
    
    var bResult = "25" < 3;
    alert(bResult); //输出 "false"
    
    这里,字符串 "25" 将被转换成数字 25,然后与数字 3 进行比较,结果不出所料。
    
    总结:
    
    比较运算符两侧如果一个是数字类型,一个是其他类型,会将其类型转换成数字类型.
    比较运算符两侧如果都是字符串类型,比较的是最高位的asc码,如果最高位相等,继续取第二位比较.
    

    注意2:

    等性运算符:执行类型转换的规则如下:
    
    如果一个运算数是 Boolean 值,在检查相等性之前,把它转换成数字值。false 转换成 0,true 为 1。 
    如果一个运算数是字符串,另一个是数字,在检查相等性之前,要尝试把字符串转换成数字。 
    如果一个运算数是对象,另一个是字符串,在检查相等性之前,要尝试把对象转换成字符串。 
    如果一个运算数是对象,另一个是数字,在检查相等性之前,要尝试把对象转换成数字。 
    在比较时,该运算符还遵守下列规则:
    
    值 null 和 undefined 相等。 
    在检查相等性时,不能把 null 和 undefined 转换成其他值。 
    如果某个运算数是 NaN,等号将返回 false,非等号将返回 true。 
    如果两个运算数都是对象,那么比较的是它们的引用值。如果两个运算数指向同一对象,那么等号返回 true,否则两个运算数不等。 
    

    3.3 逻辑运算符

    if (2>1 && [1,2]){
        console.log("条件与")
    }
    
    // 思考返回内容?
    console.log(1 && 3);
    console.log(0 && 3);
    console.log(0 || 3);
    console.log(2 || 3);
    

    4、流程控制  

    • 顺序结构(从上向下顺序执行)
    • 分支结构
    • 循环结构

    4.1  顺序结构

        <script>
            console.log(“星期一”);
            console.log(“星期二”);
            console.log(“星期三”);
        </script>
    

    4.2 分支结构

    if-else结构:

    if (表达式){
       语句1;
       ......
       } else{
       语句2;
       .....
       }
    

    功能说明:如果表达式的值为true则执行语句1,否则执行语句2

    示例:

    var x= (new Date()).getDay();
            //获取今天的星期值,0为星期天
            var y;
    
            if ( (x==6) || (x==0) ) {
                y="周末";
            }else{
                y="工作日";
                }
            
            console.log(y);
    
            /*等价于
    
            y="工作日";
            if ( (x==6) || (x==0) ) {
            y="周末";
            }
            console.log(y);  */
    

    if-elif-else结构:

    if (表达式1) {
        语句1;
    }else if (表达式2){
        语句2;
    }else if (表达式3){
        语句3;
    } else{
        语句4;
    }  

    示例:

    var score=window.prompt("您的分数:");
    
    if (score>90){
        ret="优秀";
    }else if (score>80){
        ret="良";
    }else if (score>60){
        ret="及格";
    }else {
        ret = "不及格";
    
    }
    alert(ret);
    

    switch-case结构

    switch基本格式
    switch (表达式) {
        case 值1:语句1;break;
        case 值2:语句2;break;
        case 值3:语句3;break;
        default:语句4;
    }
    

    示例:

    switch(x){
    case 1:y="星期一";    break;
    case 2:y="星期二";    break;
    case 3:y="星期三";    break;
    case 4:y="星期四";    break;
    case 5:y="星期五";    break;
    case 6:y="星期六";    break;
    case 7:y="星期日";    break;
    default: y="未定义";
    }
    

    switch比else if结构更加简洁清晰,使程序可读性更强,效率更高。  

    4.3 循环结构  

    for循环:

    语法规则:
    
        for(初始表达式;条件表达式;自增或自减)
        {
                执行语句
                ……
        }
    

    功能说明:实现条件循环,当条件成立时,执行语句1,否则跳出循环体

    for循环的另一种形式:

    for( 变量 in 数组或对象)
        {
            执行语句
            ……
        }
    

    while循环:  

    语法规则:
    
    while (条件){
        语句1;
        ...
    }
    

    功能说明:运行功能和for类似,当条件成立循环执行语句花括号{}内的语句,否则跳出循环;同样支持continue与break语句。
    示例:

    var i=1;
    while (i<=7) {
        document.write("<H"+i+">hello</H "+i+"> ");
        document.write("<br>");
        i++;
    }
    //循环输出H1到H7的字体大小
    

    4.4 异常处理  

    try {
        //这段代码从上往下运行,其中任何一个语句抛出异常该代码块就结束运行
    }
    catch (e) {
        // 如果try代码块中抛出了异常,catch代码块中的代码就会被执行。
        //e是一个局部变量,用来指向Error对象或者其他抛出的对象
    }
    finally {
         //无论try中代码是否有异常抛出(甚至是try代码块中有return语句),finally代码块中始终会被执行。
    }
    

    注:主动抛出异常 throw Error('xxxx')

      

    五 JavaScript的对象

      

      

     

    http://www.cnblogs.com/yuanchenqi/category/1050263.html  

  • 相关阅读:
    第7.10节 Python类中的实例变量定义与使用
    第7.9节 案例详解:Python类封装
    第7.8节 Python中隐秘的类封装方法
    第7.7节 案例详解:Python类继承机制
    第7.6节 Python中类的继承机制详述
    第7.5节 揭开Python类中self的面纱
    第7.4节 Python中与众不同的类
    第7.3节 Python特色的面向对象设计:协议、多态及鸭子类型
    第7.2节 关于面向对象设计的一些思考
    (独孤九剑)--流程控制
  • 原文地址:https://www.cnblogs.com/junxun/p/7693428.html
Copyright © 2020-2023  润新知