为什么 console.log 显示不正确的对象值?

Why console.log displays incorrect object's values?

在我引入这些数字之前,我不明白为什么 console.log 显示 d1 包含 [100,200,300]。不过,常规 for loop 会正确显示 d1 的内部结构。有人可以解释 Google Chrome 中 console.log 的 behavior/bug 吗? https://jsfiddle.net/ZSvyt/

var container = {};
container["0"] = [10, 20, 30];
var d1 = container;

console.log('before console.log');
console.log(d1); // <--- IT DISPLAYS [100, 200, 300]. WHY?

// before for loop
console.log('before for loop');
for (var i = 0; i < d1["0"].length; i++) {
    console.log(d1["0"][i]);
}

container["0"] = [100, 200, 300];

console.log('after console.log');
console.log(d1);

// after for loop
console.log('after for loop');
for (var i = 0; i < d1["0"].length; i++) {
    console.log(d1["0"][i]);
}

输出:

before console.log
Object {
    0: Array[3]
}
0: Array[3] 
0: 100
1: 200
2: 300 

before for loop
10
20
30

after console.log
Object {
    0: Array[3]
}
0: Array[3] 
0: 100
1: 200
2: 300

after for loop
100
200
300

那是因为控制台中的内容是 dt 的引用,而不是副本。

您可以复制对象并记录它(来自this question 的代码)。

或者您可以使用 JSON.stringify.

记录表示它的字符串

console.log( JSON.stringify(dt) ); 将其打印为字符串。

此外,如果您正在使用 lodash,那么您可以使用 console.log(_.cloneDeep(dt)) 克隆并记录当时对象内的正确值。