JavaScript参数传递中值和引用的一种理解的代码实例
我将剖析一个例子的实际运行过程，跟大家分享我对js参数传递中的值和引用的理解。
参考官网数据类型的两种分类，本文将这两种分类简称为基本类型（boolean, null, undefined, string, number, symbol）和object类型。
首先，用一个example 演示参数传递的应用：
var obj = {};
obj.inner = 10;
var num = 10;
var str = 'Hello';
var boo = true;
var oth = null;
var und = undefined;
var sym = Symbol('foo');
function passingobject(myobj){
myobj.inner = 1 + myobj.inner ;
}
function passingvalue(myvalue){
switch(typeof myvalue){
case 'number':
myvalue = myvalue + 1;
break;
case 'string':
myvalue = 'I am a new string now!';
break;
case 'boolean':
myvalue= false;
break;
default:
myvalue = 'Null, Undefined, or Symbol';
}
}
console.log("before num = " + num); // before num = 10
passingvalue(num);
console.log("after num = " + num); // after num = 10
console.log("before str = " + str); // before str = Hello
passingvalue(str);
console.log("after str = " + str); // after str = Hello
console.log("before boo = " + boo); // before boo = true
passingvalue(boo);
console.log("after boo = " + boo); // after boo = false
console.log("before oth = " + oth); // before oth = null
passingvalue(oth);
console.log("after oth = " + oth); // after oth = null
console.log("before und = " + und); // before und = undefined
passingvalue(und);
console.log("after und = " + und); // after und = undefined
console.log(sym); // Symbol(foo)
passingvalue(sym);
console.log(sym); // Symbol(foo)
console.log("before obj.inner = " + obj.inner); // before obj.inner = 10
passingobject(obj); // after obj.inner = 11
console.log("after obj.inner = " + obj.inner);
从example 1 的结果似乎可以总结出以下两条结论：
1. 传递的数据类型为基本类型（number, string boolean, null, undefined, symbol），在参数传递过程中，函数内部对传递值的操作并不影响原始值。
2. 传递的数据类型为object， 在参数传递过程中，函数内部对传递值的操作会导致原始值的改变。
然而， 有没有其他特殊情况呢？
有一种在*讨论很火热的用法，跟结论二背道而行。example 2。
例子引自：http://www.php.cn/
1 function changeStuff(a, b, c)
2 {
3 a = a * 10;
4 b.item = "changed";
5 c = {item: "changed"};
6 }
7
8 var num = 10;
9 var obj1 = {item: "unchanged"};
10 var obj2 = {item: "unchanged"};
11
12 console.log(obj1.item); // unchanged
13 console.log(obj2.item); // unchanged
14 changeStuff(num, obj1, obj2);
15 console.log(obj1.item); // changed
16 console.log(obj2.item); // unchanged
example 2中， obj2.item并没有被函数changeStuff改变。changeStuff内部同样改变了b、c的值，为什么obj1被改变了(L15)而obj2没有被改变呢？
我用js的执行上下文对这种现象进行解释，如图。
在js运行过程中，编辑器动态生成执行上下文（execution context），example 2中，首先生成global的执行上下文和changeStuff的执行上下文。
执行到changeStuff(num, obj1, obj2)的时候， a, b, c指向参数num, obj1, obj2，a和num指向10， b跟obj1指向同一个值，c跟obj2指向同一个值。
执行step 1的时候，对a重新赋值，为a赋值前的10倍，从此a与num毫无关系。
执行step 2的时候，对b所指向的值的item属性进行重新赋值，这个赋值只改变了item的值， 而obj1和b仍然指向同一个值。
执行step 3的时候，对c重新赋值，从此c与obj2再无瓜葛，因此即使c有一个叫item的属性，与obj2的item属性有着各自的值，并没有影响obj2.item。
也就是说，js函数参数传递过程中，若函数内部对参数重新赋值，这个赋值过程不会影响原始变量的值。
这也很好地解释了基本类型的参数变量（结论1）不会受影响的现象，基本类型的参数变量每一次改变都是一次全新赋值，对原始变量不会造成影响。
总结
在js函数传递中，当基本类型（number, string, boolean, null, undefined, symbol）变量作为参数传递时，函数内部对参数的任何操作都不会改变变量的值。
当object类型变量作为参数传递时，函数内部对参数的操作会影响变量的值，除非函数内部对参数重新赋值（任何类型的值）。
Thank you!
Feel free to contact me if you have any question!
以上就是JavaScript参数传递中值和引用的一种理解的代码实例的内容，更多相关内容请关注PHP中文网（www.php.cn）！