javascript以错误的顺序执行

Question

在Chrome控制台中，似乎第二行在第一行之前执行。 为什么？

function fn(obj){
    console.log(obj);
    obj.a = 1;
}

fn({b:1}); // prints {a:1, b:1} in console! WHAT!!!
fn({});    // prints {}. OMG. WHAT. This is inconsistent with above behaviour!

这不会发生在Edge控制台中。

Answer 1

您正在将对象记录到控制台。 无论您记录什么，都是对实际对象的引用。 由于您更新了对象，因此引用将反映最新值。

要进行测试，您可以在设置它的值之前尝试记录obj.a.

Answer 2

它似乎是Chrome devtools控制台的一个bug功能。 例如，如果您运行此代码段，您将获得

{
  "b": 1
}

但是，如果您同时打开Chrome控制台，您将获得以下内容：

{b: 1}
  a:1
  b:1

正如您所看到的，第一行反映了记录时的obj状态，但是当您单击它时，它的内容似乎会更新。

在记录对象右侧还有一个蓝色信息工具提示，上面写着：“下面的值刚刚评估过了”，确认这是一个功能，而不是一个bug。

 function fn(obj){ console.log(obj); obj.a = 1; } fn({b:1}); 

Answer 3

那是因为当你检查时

{B：1}

功能已经完成。

如果你在函数完成之前检查obj，你会发现;例如：

在控制台上的obj，当像{...：......，...：...}这样的行为时

它是一个参考，

当你检查它时，它会显示当时obj的快照。这时候，obj总是喜欢{

...：...

...：...

}

例如：

实际上，这是当时真正的对象。

所以，当你有时间检查obj时，功能已经完成。所以，你没有机会在那一刻检查obj，除了：

JSON.parse(JSON.stringify(obj)); 

给你另一个obj，看看那一刻发生了什么。