zoukankan      html  css  js  c++  java
  • 浅析js的函数的按值传递参数

    js的函数传参的方式是按值传递,正常情况下,改变函数参数的值,并不会对函数外部的变量造成影响。例如:

    'use strict';
    var
    list = [1, 2, 3]; list.forEach(function(item) { item ++; }); console.log(list); // [ 1, 2, 3 ]

    这是因为js的函数在接收参数时,会生成一个副本变量,该副本变量等于参数的值,可以分析js这样运行的:

    'use strict';
    var list = [1, 2, 3];
    list.forEach(function(item, i) {
        // 第一个item是副本,第二个item是数组元素list[i]
        var item = item;
        // 副本item++
        item ++;
        // 打印的是副本的值
        console.log(item); //    2, 3, 4
    });
    // 原数组不会改变
    console.log(list);    //    [ 1, 2, 3 ]

    但是当函数的参数传递的是一个对象呢?

    'use strict';
    var
    list = [{a: 1, b: 2}]; list.forEach(function(item) { item.a ++; }); console.log(list); // [ { a: 2, b: 2 } ]

    发现函数内部居然改变了函数外部变量的值,那这又是为什么呢?

    我们来分析js是如何运行这段代码的

    'use strict';
    var list = [{a: 1, b: 2}];
    list.forEach(function(item, i) {
        // 第一个item是副本,第二个item是数组元素list[i]
        var item = item;
        // 此时item和list[i]指向的是同一地址,故两者完全一样
        console.log(item === list[i]);    //    true
        // 此时item.a++ 亦即 list[i].a++
        item.a ++;
        // list[i]的值已经改变
        console.log(list[i]);    //    { a: 2, b: 2 }
    });
    console.log(list);    //    [ { a: 2, b: 2 } ]

     那么为什么会产生这种情况呢?

    由于js中对象属于引用类型,var item = item 这一步相当于把 list[i] 的地址赋值给了item,他们两个指向的都是原对象的地址,所以通过其中的一个去修改值时其实是修改他们指向的那个对象。例子中通过 item.a++ 方法改变了原对象的值,因此最后应该输出 [ { a: 2, b: 2 } ]。

    飞鸟尽,良弓藏
  • 相关阅读:
    mysql,SQL标准,多表查询中内连接,外连接,自然连接等详解之查询结果集的笛卡尔积的演化
    java:JDBC详解
    卷积在深度学习中的作用(转自http://timdettmers.com/2015/03/26/convolution-deep-learning/)
    卷积(转自wiki百科)
    windows10环境下安装Tensorflow
    3、继承与派生
    2、对象和类
    1、从C语言到C++
    使用Jupyter Notebook编写技术文档
    3、利用GDB进行程序调试
  • 原文地址:https://www.cnblogs.com/shenshangzz/p/7839521.html
Copyright © 2011-2022 走看看