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: , b: }];
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 } ]。

浅析js的函数的按值传递参数的更多相关文章

  1. js 获取函数的所有参数名

    具体思路: 利用Function.toString()方法,获取到函数的源码,再利用正则匹配获取到参数名字. 实现代码(代码基于ES6): // 获取函数的参数名 function getParame ...

  2. js 以函数名作为参数动态执行 函数

    function myFunc() { console.log(11111); } test("myFunc"); function test(funcName) { if(typ ...

  3. js 事件函数中的参数带换行符或换行标签都不能起作用的解决方法

    把问题参数值赋给标签的属性data-value,通过属性值获取参数值.

  4. 【js】函数问题

    一.函数重载问题: 由于js的函数传入的参数当做arguments对象(和数组类似,但不是Array的实例),传入的参数类型和数量没有限制,没有函数签名,所以如果要实现重载功能 的话,只能是不够完美得 ...

  5. JS:函数多个参数默认值指定

    函数有一个参数时,以往这样定义(参数为p1): function mfun(p1){ … } 当需要为p1设定一个默认值时 function mfun(p1){ if(p1===undefined) ...

  6. js调用函数时传入的参数个数与函数定义时的参数个数不符时的操作

    在js中函数没有重载的概念,如果声明了多个重名的函数,不管函数的形参个数是否一样,只有最有一个有效,其他的函数声明都是无效的.比如说声明了两个函数fn(),第一次声明时没有形参,第二次声明时形参有两个 ...

  7. JS中函数参数和函数返回值的理解

    函数本质就是功能的集合 JS中函数是对象,因此,函数名实际上仅仅是一个指向函数对象的指针,不会与某个函数绑定,所以,JS中没有重载(重载就是通过传递不同类型的参数,使两个相同函数名的函数执行不同的功能 ...

  8. js 四舍五入函数 toFixed(),里面的参数 就是保留小数的位数。

    js 四舍五入函数 toFixed(),里面的参数 就是保留小数的位数. <script language="javascript"> document.write(& ...

  9. 关于js 中函数的参数

    var a = 100; function test(a){ a++; //a(形参)是局部变量 console.log(a); } test(a); console.log(a); //结果是 10 ...

随机推荐

  1. Java二分法查找

    二分法查找 /** * 二分法查找 找不到返回-1 * @author yangzi * */ public class TwoFind { public static int twoFind(int ...

  2. 手机端h5复制功能

    html: <a href="javascript:;" id="copyBtn" class="f-r tac" data-clip ...

  3. vue中websoket的使用

    首先安装npm install --save  websocket-heartbeat-js@^1.0.7 在main.js中  引入并挂载全局方法 import WebsocketHeartbeat ...

  4. Vscode下调试基于Homestead环境的Laravel框架

    PS:最近在学Laravel框架,本机IDE是Vscode,因为Vscode是真的好用!今天突然想调试php代码了,于是疯狂地在网上查资料,经过一上午的不懈努力,终于成功了! 准备工作 首先环境要保证 ...

  5. Luogu P1349 广义斐波那契数列

    解题思路 既然广义斐波那契,而且数据范围这么大,那么我们使用矩阵快速幂来进行求解.大家都知道斐波那契的初始矩阵如下 $$\begin{bmatrix}1&1\\1&0\end{bmat ...

  6. UVA12118 Inspector's Dilemma(欧拉路径)

    题目: 某个国家有V(V≤1000)个城市,每两个城市之间都有一条双向道路直接相连,长度为T(每条边的长度都是T).你的任务是找一条最短的道路(起点和终点任意), 使得该道路经过E条指定的边.输出这条 ...

  7. APUE 文件和目录

    文件和目录 Unix 所有的文件都对应一个 struct stat,包含了一个文件所有的信息. #include <sys/stat.h> struct stat { mode_t st_ ...

  8. python3.x Day1 用户登录程序练习

    训练1: 模拟登陆: 1. 用户输入帐号密码进行登陆 2. 用户信息保存在文件内 3. 用户密码输入错误三次后锁定用户 login2.py: #!/usr/bin/env python # -*- c ...

  9. cmd杀死进程

    打开cmd 1.查看所有进程占用的端口 输入:netstat –ano(查看所有进程,查找相应占用端口的程序的pid) 直接查看占用指定端口的程序的pid 输入:netstat -ano|findst ...

  10. java--删除链表偶数节点

    public class ListNode { int data;//当前节点的值 ListNode next = null;//是指向下一个节点的指针/引用 public ListNode(int ...