变量的赋值之想不开

Question

事情是酱紫的:
有一个数组arr非空,
有一个对象obj中有一个supplier属性,
现在代码是这样的

arr =[{"name":"aa","age":"23"},{"name":"bb","age":"24"}];
obj.supplier = arr;
console.log(obj.supplier);
//这里有时候可以打印出来数组,但是长度是对的,可惜里面每个元素都是空的;有时候直接打出来的是个空数组
//然后这里执行了其他的代码,其中包含一个ajax请求,
//在ajax请求的回调always中我清空了数组arr
$.ajax({
    ...
}).always(function (){
arr =[];
});

我不理解的是js顺序执行的时候 我曾经在console.log前放debugger,一步一步执行的时候是没有问题的,并且打印出来的数据也是没问题的,一旦中间不间断的执行结果总是不对,
求指教~~
另外 我也考虑过是不是跟数组是引用类型有关系,引用类型的值是按照引用访问的,所以在下面把数组清空的时候上面的obj.supplier也受到了影响呢?但是js 不是顺序执行么,那console.log的时候打印也应该是正确的 而不应该是现在这样的结果.
求指教~~

Answer 1

恭喜你，碰到了关于 console.log 惰性求值的问题！

先说结论：console.log 是不靠谱的（当考察代码的执行顺序以及依赖关系的时候），所以你的代码要想让它运行起来“没有意外”，那就把 arr 复制一下。比如说用 lodash：

obj.supplier = _.clone(arr)

这样就没事了。

至于 console.log 的问题，由于它并非标准里确定的 API，所以浏览器的实现是没有标准可言的。有时候会出现同步的 console.log 与异步的 console.log 的困惑，也有立刻求值的 console.log 和惰性求值的 console.log 的差异。你遇到的是后者。

---

补充参考：http://stackoverflow.com/questions/4057440/is-chromes-javascript-console-lazy-about-evaluating-arrays