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，看看那一刻發生了什么。