js的函数的按值传递参数(实例讲解)
2017-11-16 10:07
696 查看
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 } ]。
以上这篇js的函数的按值传递参数(实例讲解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。
您可能感兴趣的文章:
相关文章推荐
- JS与PHP向函数传递可变参数的区别实例代码
- JS与PHP向函数传递可变参数的区别实例代码
- 在动态THML语句中调用JS函数传递带空格参数的问题
- JS控制静态页面之间传递参数获取参数并应用的简单实例
- ios--网页js调用oc代码+传递参数+避免中文参数乱码的解决方案(实例)
- pthread_create函数的详细讲解(包括向线程函数传递参数详解)
- js 把函数作为参数传递给另一个方法
- js中函数参数arguments、callee、caller,值传递、重载
- JS把函数当作参数传递
- js 函数参数按值传递的理解
- js中的函数参数传递原则
- 基于proteus的51单片机仿真实例三十七、C语言的函数参数传递
- js--变量的复制与函数参数的传递
- ios--网页js调用oc代码+传递参数+避免中文参数乱码的解决方案(实例+demo)
- 深入解析js中基本数据类型与引用类型,函数参数传递的区别
- JS传递对象数组为参数给后端,后端获取的实例代码
- *函数参数传递类的类型,在函数内部动态创建不同类型的实例
- JS中setInterval、setTimeout不能传递带参数的函数的解决办法