有時候，console.log輸出的並非當時想輸出的結果，而是執行結束之後的結果。

• 例如，有一個迴圈向陣列新增資料，並輸出陣列在每一次新增新項的結果：

let a = [];
for(let i=0;i<10;i++){
    a.push(i);
    console.log(a);
}

控制檯輸出為：

控制檯輸出.png

乍一看輸出十分正常，可是當把陣列的箭頭展開時。

控制檯輸出.png

陣列內部卻並非預料中的一樣，而是輸出了最後的執行結果。

• 個人的猜想：
  在console.log執行的時候，瀏覽器會對log的物件求一次值，打印出來是 Object ，可以繼續展開。但當你展開控制檯中的 Object 的時候，瀏覽器又會對它求一次值，這一次是顯示它的屬性。所以才會有前後列印的東西不一樣的情況發生，因為物件引用的實體的值改變了。

• 如果把 console.log(a) 改為 console.log(JSON.parse(JSON.stringify(a)))

  控制檯輸出.png

  便是剛開始期望的結果。

本文轉自 https://www.jianshu.com/p/6db4a08d69af，如有侵權，請聯絡刪除。