Javascript 对象同时显示不同的值

Question

我试图理解为什么下面的代码会这样运行。具体来说，为什么第一个 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 循环在每次迭代中查看对象的状态。我很惊讶地看到输出到控制台的对象每次都相同；该状态是整个循环执行后对象的最终状态。

更让我困惑的是，我真正想了解的部分是，为什么读取对象的属性 do 似乎作为一个（或至少我) 会期望，在同一时刻，整个对象本身似乎具有不同的值。

我想也许 this question or this question 可能有助于解释，但我认为它们并不完全相关。

Answer 1

来自 MDN console.log 文档：

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

Please be warned that if you log objects in the latest versions of Chrome and Firefox what you get logged on the console is a reference to the object, which is not necessarily the 'value' of the object at the moment in time you call console.log(), but it is the value of the object at the moment you click it open.

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

如果当时要记录对象，使用console.log(JSON.parse(JSON.stringify(obj)))。

Javascript 对象同时显示不同的值

Javascript object displays differing values at the same time

javascript

scope

google-chrome-devtools

console.log