zoukankan      html  css  js  c++  java
  • WEB前端第二十八课——js变量提升、内置对象(Math&Date)

    1.变量提升

      JavaScript引擎的工作方式是,先解析代码,获取所有被声明的变量,然后再自上而下逐行运行代码

      因此,所有非函数内的变量声明语句,都会被提升到代码的头部,JavaScript这种读取变量的机制叫作变量提升

      注意,变量提升只对 var命令声明的变量有效,如果不是用 var命令声明的变量,就不会发生变量提升

    2.变量作用域

      var声明的变量称为局部变量,局部变量仅在其所在的函数范围内生效,变量生效的范围被称为变量作用域

      如果不适用 var声明,则表示变量在整个文件内生效,即全局变量

    3.一等公民

      在很多传统语言(C/C++/Java/C#)中,函数都是作为一个二等公民存在,

      因为,除了调用函数外,如果要把函数作为参数传给另一个函数,或者赋值给一个本地变量,或者作为返回值,就需要通过函数指针(function pointer)、代理(delegate)等特殊方式周折一番;

      但是,JavaScript中函数却是一等公民,它不仅拥有一切传统函数的使用特性(声明和调用),还可以像简单值一样赋值、传参、返回,这样的函数也被称之为第一级函数(first-class function)或一等公民。

      JavaScript中的函数与其它数据类型(数值、字符串、布尔值等)处于同等地位,可以使用其它数据类型的地方就能使用函数

    4.函数提升

      JavaScript引擎对函数的处理机制与变量一样,采用 function命令声明的函数,整个函数会像变量声明一样,被提升到代码头部

      注意,函数提升只对 function命令声明的函数有效

    5.函数内的变量提升

      与全局作用域一样,函数内部也会产生变量提升,也就是说,使用 var命令声明的变量,不管在什么位置,变量声明都会被提升到函数体的头部。

    6.函数参数的默认值

       示例:function func(num){

          num=num || 1;  // 可以理解为三目条件表达式:判断条件?true:false;

          return num;

         }

         func();  // 返回值为 1

      上面写法会对函数参数 num进行一次布尔运算,判断结果为 true时返回num、结果为 false时返回 1,避免了因忘写参数而导致的函数调用失败问题

      但是,除了undefined外,0、空字符、null等的布尔值也是false,也就是说在上面函数中,如果参数等于 0或空字符串,在有参数的情况下,也会返回默认值1

    7.值传递和地址传递

      基础数据类型(数值、字符串、布尔值)的内容传递方式是值传递(pass by value)

      复合数据类型(数组、对象、其他函数)的内容传递方式是地址传递(pass by reference)

    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Function</title>
    </head>
    <body>
    
    <script>
        var num=20;
        function consulate(x) {
            x*=3;
            console.log(x);
            return x/2;
        }
        var res=consulate(num);
        console.log(res);
        console.log(num);
    </script>
    </body>
    </html>
    

    8.函数的同名参数

      如果函数有同名的参数,则调用时取最后出现的那个参数值,示例如下

    <script>
        var num1=20;
        var num2=30;
        function consulate(x,x) {
            x*=3;
            console.log(x);
            return x/2;
        }
        var res=consulate(num1, num2);
        console.log(res);
    </script>
    // 运行结果为:90 和 45.
    

      如果调用函数时没有提供最后一个参数,函数的取值就会显示为 undefined

      原则上,尽量不要写同名参数,而且定义函数时设置了几个参数,在调用时尽量保证和定义时一致

    9.arguments对象

      JavaScript中允许函数有不定数目的参数,arguments对象则可以在函数体内部读取所有参数,

      arguments对象包含了函数 运行时 所有的参数

      arguments[0]代表函数的第一个参数,arguments[1]代表第二个参数,依次类推

      arguments对象只有在函数内部才可以使用,示例如下

    <script>
        function arg(x) {
            console.log(arguments[0]);  // 1
            console.log(arguments[1]);  // 2
            console.log(arguments[2]);  // 3
        }
        arg(1,2,3);
    </script>
    

      另外,arguments对象除了读取参数,还可以对参数赋值,级别优先于调用函数的实参

        语法:arguments[0]=10;

      再有,还可以通过 arguments对象的 length属性,判断函数调用时究竟带了几个参数

        语法:arguments .length;

      arguments的数据类型属于 对象,并非数组!

    10.eval函数

      eval() 函数可以可以计算某个字符串,并执行其中的JavaScript代码

      语法:eval(string);  (作用:将字符串当作语句执行)

      该方法只接受 原始字符串 作为参数,如果 string参数不是原始字符串,那么该方法将不做任何改变的返回

      因此,不要为 eval()函数传递 string对象来作为参数

      如果 eval()函数在使用过程中发生非法调用或传入参数错误,会抛出异常

    <script>
        var str='var eva="car"';
        eval(str);
        console.log(eva);  //不使用eval()函数时,报错变量未定义异常!
    </script>
    

    11.instanceof类型判断

      typeof用于检测和识别原始数据类型,而 instanceof用于判断一个变量是否属于某个类型的实例

      typeof语法:typeof  变量名; ,返回值为数据类型

      instanceof语法:变量名  instanceof  数据类型; ,返回值为布尔值

    12.Math对象

      Math对象是JavaScript的内置对象,提供一系列的数学常数和数学方法

      该对象没有构造函数Math(),所以不能生成实例,所有属性和方法都必须在Math对象本身上调用

      Math对象属性,表示只读的数学常数

        Math.E  常数e(2.718281828459045)

        Math.LN2  2的自然对数(0.6931471805599453)

        Math.LN10  10的自然对数(2.302585092994046)

        Math.LOG2E  以2为底的e的对数(1.4426950408889634)

        Math.LOG10E  以10为底的e的对数(0.4342944819032518)

        Math.PI  常数圆周率 PI(3.141592653589793)

        Math.SQRT1_2   2的平方根的倒数,即1/2的平方根(0.7071067811865476)

        Math.SQRT2  2的平方根(1.4142135623730951)

    13.Math对象方法

      Math.round(x),四舍五入

      Math.floor(x),向下取整(返回小于参数值的最大整数)

      Math.ceil(x),向上取整(返回大于参数值的最小整数)

      Math.abs(x),返回参数的绝对值

      Math.max(x,y,z,...,n),返回参数中最大的值

      Math.min(x,y,z,...,n),返回参数中最小的值

      Math.pow(x,y),返回以 x 为底数、y为幂的指数值

      Math.sqrt(x),返回参数值的平方根,如果参数为负数则返回NaN

      Math.log(x),返回以 e为底的自然对数

      Math.exp(x),返回常数 e的 x幂的指数值

      Math.sin(x),返回参数的正弦值,x为一个以弧度表示的角,返回值为 -1到1之间,将角度乘以 0.017453293 (2PI/360)即可转换为弧度

      Math.cos(x),返回参数的余弦值,x是一个数值,返回值为 -1到1之间

      Math.asin(x),返回参数的反正弦值,x是一个介于 -1.0 ~ 1.0 之间的数值,返回-PI/2 到 PI/2 之间的弧度值, x 超过 -1.0 ~ 1.0 范围时返回 NaN

      Math.acos(x),返回参数的反余弦值,x是一个介于 -1.0 ~ 1.0 之间的数值,返回 0到 PI 之间的弧度值, x 超过 -1.0 ~ 1.0 范围时返回 NaN

      Math.tan(x),返回参数的正切值,x为一个以弧度表示的角

      Math.atan(x),返回参数的反正切值,x是一个数值,返回 -PI/2 到 PI/2 弧度之间的数值

      Math.random(),返回介于 0(包含)~ 1(不包含)之间的一个伪随机数

    14.Math.random()方法

      创建一个规定范围内的随机整数

    <script>
        function getRandomNumber(min,max) {
            return Math.floor(Math.random()*(max-min)+min);
        }
        console.log(getRandomNumber(10,100));
    </script>
    

      创建一定长度的随机验证码

    <script>
        function getRandomNumber(min,max) {
            return Math.floor(Math.random()*(max-min)+min);
        }
        function getRandomVerify(len) {
            var verifyCode='';
            var verifyCharSet='ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-_!@#$%^&*';
            var maxNum=verifyCharSet.length
            for (var i=0;i<len;i++){
                var index=getRandomNumber(0,maxNum);
                var verifyStr=verifyCharSet[index];
                verifyCode+=(verifyStr+' ');
            }
            return verifyCode
        }
        console.log(getRandomVerify(5));
    </script>
    

    15.Date对象

      Date对象是JavaScript提供日期和时间的操作接口

      在JavaScript内部,所有日期和时间都存储为一个整数

      这个整数是当前时间距离1970年1月1日00:00:00的毫秒数,正负的范围为基准时间前后各1亿天

      同 Math对象一样,JavaScript也为 Date对象提供了很多内置方法

    16.Date()函数

      Date()函数可以被Date对象直接调用,返回一个当前日期和时间的字符串

      语法示例:var date=Date();

      不论有没有参数,直接调用Date总是返回当前时间

    17.Date(日期字符串 | 日期参数)构造函数

      Date对象是一个构造函数,对它使用 new命令,会返回一个 Date对象的实例

      语法示例:var date=new Date('August 21,1999');

      如果不加参数则代表返回当前时间的对象,如果添加一个日期字符串作为参数则返回字符串所对应的时间

      添加日期参数,则返回参数对应的时间,语法示例:var date=new Date(year,month,day,hours,minutes,seconds,ms),

      使用日期参数时,年、月必须填写,其他参数可以省略(默认为 0),月份为从0开始到11结束

    18.日期运算

      日期在JavaScript内部存储的时候,是以距离1970年1月1日零点的毫秒数的形式存储的。

      因此,两个日期对象进行减法运算时,返回值是它们间隔的毫秒数;而两个日期对象进行加法运算时,返回值是连接后的两个字符串。

    19.日起对象的 get系列方法

      getTime();返回实例对象距离1970年1月1日零点的毫秒数,等同于valueOf方法

      getDate();返回实例对象对应每个月的几号(从1开始)

      getDay();返回星期几,星期日为0,星期一为 1,以此类推

      getYear();返回距离1900年的年数

      getFullYear();返回四位的年份

      getMonth();返回月份(0表示1月,11表示12月)

      getHours();返回小时(0到23)

      getMinutes();返回分钟(0到59)

      getSeconds();返回秒(0到59)

      getMilliSeconds();返回毫秒(0到999)

      示例代码:

    <script>
        var date=new Date();
        var tim1=date.getDate();
        var tim2=date.getDay();
        console.log(tim1);
        console.log(tim2);
    </script>
    
    <script>
        var today=new Date();
        var lastDay=new Date(today.getFullYear(),11,31,23,59,59,999);
        var msDay=24*60*60*1000;
        var leftDays=Math.floor((lastDay-today)/msDay)
        console.log(leftDays);
    </script>
    
  • 相关阅读:
    设计模式之《工厂方法》
    设计模式之 《简单工厂》
    fegin 调用源码分析
    ajax上传预览
    ajax小应用
    ajax执行流程1
    ajax异步post方法
    ajax get异步方法
    js ajax请求流程
    form表单提交
  • 原文地址:https://www.cnblogs.com/husa/p/13551482.html
Copyright © 2011-2022 走看看