美文网首页
ECMAScript变量类型、函数以及函数传参(值传递和引用传递

ECMAScript变量类型、函数以及函数传参(值传递和引用传递

作者: 林枫1 | 来源:发表于2020-04-26 18:20 被阅读0次

    1. JS中的变量类型:

    a. JS的基础数据类型:UndefinedNullBooleanNumberStringObject

    a.1 UndefinedNull类型都是只有一个值的基础类型
          Undefined类型中只有值 undefined,代表值没有定义
          Null类型中只有值 null,代表值为空(不是空字符串,不是空对象,也不是空数组)
          undefined == null 返回 trueundefined=== null 返回 false
           (相等运算先转换后比较,全等运算只比较不转换)
        a.2 NaNInfinity都是Number类型中特殊的值
          NaN表示没有值的Number类型 1/{} 就会返回 NaN
          Infinity 表示无穷大,正无穷大:Number.POSITIVE_INFINITY;负无穷大:Number.NEGETIVE_INFINITY
          NaN 值与任何值都不想等,包括它本身,正无穷大加上负无穷大得到 NaN ,因为不确定

    b. JS中的变量类型:

    b.1 基本类型: UndefinedNullBooleanNumberString
          基本类型变量的值存储的就是上述五种基础数据结构的值
        b.2 引用类型:由多种类型组成的对象 Object [1]


    2. JS中的函数

    ES标准中的函数与别的语言不同而造成难以理解的地方:

    a. JS中的函数定义不需要指定返回值类型,但是在任何函数的任何地方都可以直接使用return语句返回一个任意类型的返回值

    b. JS中函数的参数使用arguments对象(like Array)实现的,所以函数调用时参数个数不需要遵循函数定义时指定的参数个数。

    function add(num1){
        return num1+10; //定义一个函数add用于给传入的参数加10
    }
    
    console.log(add(5));   // 15
    console.log(add(5,10));   // 15
    

    可以看到,函数add定义时只指定了一个命名参数num1,但是调用console.log(add(5,10))也是居然没有报错并且得到了正确的结果。这是因为按照ES标准,JS函数参数的实现使用arguments对象(一个类数组对象),所以不管函数调用时传参个数多少个,真正执行时函数实例得到参数都时一个arguments对象

    同时,需要注意的是:
        b.1 在函数内部可以用arguments对象带下标arguments[i]去枚举传入的所有参数
        b.2 在函数内部,arguments对象可以和命名参数混合使用,没有传递的命名参数一律用undefined代替(注意不是赋值Undefined,而是直接传了一个undefined,不同的地方在于:赋值undefined以为着传入的是一个还可以更改值的变量,而直接传undefined传的是一个不能更改的常量值)
        b.3 因为arguments对象的缘故,JS函数不存在重载,也不需要重载
        b.4 JS函数参数传递只有值传递,没有引用传递(这一点将在第三点结合变量类型解释)


    3. ES标准中的函数参数传递

    前文介绍了JS的基础数据类型、变量类型和函数以及JS函数的注意事项,现在我们来看一下ES标准中函数参数传递中提到的    b.4: JS函数参数传递只有值传递,没有引用传递
           我们都知道,诸如C和JAVA这样的语言,传参时都存在值传递和引用传递,值传递不会修改外部变量,引用传递会修改外部变量。那么ES的标准中说的JS语言函数参数传递只采用值传递,没有引用传递是怎么一回事呢?我们来看一段代码:

    function setAge1(obj,age){ 
        obj.age = age;
    }
    
    var person = new Object();
    setAge1(person,20);
    console.log(person.age); //结果居然是20,外部的person值被改了?
    

    上述代码我们可以看到,函数setAge1内部的代码就是对参数objage属性赋值为传入命名参数的age的数值。主程序中先new了一个空对象person,然后将对象person 传入setAge1,并且age参数为20,函数setAge1 内部将给局部变量objage属性赋值20,调用完函数setAge1后,我们发现全局变量person的name值也被附上20。
     ???不是说好的,只有值传递,没有引用传递吗?正确的结果难道不应该是undefined吗?为什么全局变量也会跟着变?这一看就是引用传参嘛,把引用传进去,函数里边直接操作引用,所以对引用的修改体现到了外部变量中

    事实上真的是这样的吗?我们再来看另一段代码

    function setAge2(obj,age){ 
        obj.age = age
        obj = new Object();
        obj.age = age+1;
    }
    
    var person = new Object();
    setAge2(person,20);
    console.log(person.age); //20
    

    上述代码我们可以看到,函数setAge2 内部先对局部变量objage属性赋值为 20,然后new出一个新的空对象并赋值给obj,并将objage属性赋值为 21,主程序也很简单,传参调用打印personage属性值。出乎意料的是,person 对象的age属性值为 20。
      现在我们来回答刚刚的问题:JS函数引用类型参数传参究竟是不是引用传参?

    函数setAge2中将局部变量objage属性赋值为20,然后对obj整体赋值为一个新对象并修改objage属性赋值为21;此时,如果JS函数的引用类型参数传参是引用传参的话,那么毫无疑问当setAge2函数运行完以后,person对象将自动更新为age为21的新对象,然而person.age的值却是20,这充分证明了JS的引用类型参数传参并非按引用传参。


    那么setAge(obj,age)的传参究竟怎么理解呢?

    其实很简单。
        1. 引用类型变量的值是该对象的引用,
        2. JS函数传参只传值不传引用,
        3. 所以函数setAge在执行时,会先将全局变量person的值复制到函数内部的局部变量obj中,所以,我们看到,局部变量obj在没有重新赋值之前指向的对象就是全局变量person指向的对象,修改obj的属性和修改person的属性是对同一个对象进行属性操作,当obj被重新赋值以后,objperson指向的对象就不是同一个对象了,因此修改局部变量obj就不会对全局变量person产生影响。同时,最后函数执行完毕之前,JS的垃圾回收机制会将局部变量obj进行销毁。


    1. 想看JS面向对象的点个赞,作者看情况发个总结帖
            引用类型变量的值存储的是该对象的引用(可以简单地将引用理解为存储着该对象在内存中的存储地址的一个指针)

    相关文章

      网友评论

          本文标题:ECMAScript变量类型、函数以及函数传参(值传递和引用传递

          本文链接:https://www.haomeiwen.com/subject/hmmjwhtx.html