通过内存分析来解释JavaScript数组赋值问题

起因是在逛sf的时候看到这样一个问题

var arr=[1,2];
var arr0=[{a:1,b:2}];
function fun(data){
    data = arr0
}
fun(arr);
console.log(arr)    //[1,2]，这里的arr的值为什么没有变？

一看这个问题，似懂非懂。后经讨论和高人指定，画了下内存图，感觉瞬间清晰了。和大家分享下，欢迎指正！

初始的内存分布，形参变量存在栈中，对象存在堆内。如图，栈中有arr，arr0，还有fun的形参data三个变量，分别指向了堆中的两个数组对象的首地址。

执行fun(arr);，将arr数组对象的首地址作为实参传入fun中，此时，data的指向发生变化，指向了arr数组对象的首地址。如图，

最后console.log(arr);,输出arr，由于arr依然指向的是原来的arr数组对象，所以输出没有变化。

那么，再看下另外的情况

var arr=[1,2];
var arr0=[{a:1,b:2}];
function fun(data){
    data[0] = 3;
    data[1] = 4;
}
fun(arr);
console.log(arr)    //[3,4]，这里的arr的值为什么又变了呢？

直接开始fun(arr);，data指向arr数组对象的首地址，拿到了arr对象的操作权限。方法内部，data对arr数组对象的值进行了修改（暂不考虑越界的问题）。结果如图，

所以最后arr被改变了。

两种代码不同的地方是，一个没改变对象本身，只是指针发生了变化。另一个是用心的指针操作了对象，所以原指针指向的数据就发生了变化。另外存在引用传递和值传递的误区。

编程的道路，因为分享越来越宽！

参考：
https://segmentfault.com/q/10...
https://segmentfault.com/q/10...