Javascript对象同时显示不同的值

时间:2018-01-02 02:18:41

标签: javascript scope google-chrome-devtools console.log

我试图理解为什么以下代码的行为与它一样。具体来说,为什么第一个console.log(...)表达式输出someObject的完整版本?我意识到它与吊装(可能?)或其他一些我不完全掌握的概念有关。只是在网上搜索这个很有挑战性,因为我没有正确搜索我想知道的词汇。

var someObject = {};
                              // OUTPUT:
console.log(someObject);      // {prop: {key: "differentValue"}} <-- WHY!?
console.log(someObject.prop); //  undefined

someObject.prop = {key:"value"};

console.log(someObject);      // {prop: {key: "differentValue"}} <-- WHY!?
console.log(someObject.prop); // {key: "value"}

someObject.prop = {key:"differentValue"};

console.log(someObject);      // {prop: {key: "differentValue"}}
console.log(someObject.prop); // {key: "differentValue"}

我在为自己编写代码时发现了这一点,我希望通过for循环在每次迭代中看到对象的状态。我惊讶地看到每次转弯时控制台的对象输出都是一样的;该状态是整个循环执行后对象的结束状态。

对我来说更令人困惑的是,我真正想要理解的部分是为什么对象的属性的读取似乎可以作为一个(或者至少我会期望,而在同一时刻,整个对象本身似乎有不同的价值。

我想也许this questionthis question可能会帮助解释,但我认为它们并不完全相关。

1 个答案:

答案 0 :(得分:3)

来自MDN console.log文档:

https://developer.mozilla.org/en-US/docs/Web/API/Console/log#Parameters

  

请注意,如果您在最新版本中记录对象   您在控制台上登录的Chrome和Firefox是一个参考   到对象,它不一定是对象的'值'   你调用console.log()的时刻,但它是值的   对象在你点击它打开的那一刻。

当您记录该属性时,您会看到当时该属性的值。当您记录对象本身时,您将看到所述对象的最新版本。

如果您想要记录对象,请使用console.log(JSON.parse(JSON.stringify(obj)))