chrome對象console.log中的奇怪行為

Question

當我嘗試在Chrome中控制一個對象的console.log時，它在console.log的第一行（你在那里看到我的posts數組長度為0的對象{small summary}）（posts：Array [0]）。

但是，當我展開帖子時，它顯示它有27個項目（這是我需要的）。

這種情況隨機發生在我身上，我不知道為什么會發生這種情況，以前有人經歷過這種情況嗎？

截圖：

更新：這種情況發生在所有瀏覽器中，因此可能與Chrome無關

Answer 1

調試器無法知道某個對象是否已被更改，這就是為什么posts屬性的呈現（在您的示例中）尚未更新的原因。 即使調試器能夠知道屬性何時被更改，每次更新它（並且所有“loggings”）都會太昂貴。

因此調試器只有在明確訪問屬性時才會檢查屬性。

在這種情況下，Chrome只執行一次：

p = []; window.x = {x: p}; 
Object {x: Array[0]}
x: Array[0]
__proto__: Object
x.x.push(1);
1
x.x.push(2);
2

點擊x ，陣列更新

p = []; window.x = {x: p}; 
Object {x: Array[2]}
x: Array[2]
   0: 1
   1: 2
   length: 2
   __proto__: Array[0]
__proto__: Object

再向數組添加一個項目並再次切換x ，大小和條目仍然存在

x.x.push(3)
3


x: Array[2]
   0: 1
   1: 2
   length: 2
   __proto__: Array[0]

在我看來，記錄器沒有必要更新對象值，因為變量watch已經具有此功能。 在那里，您始終可以更新變量的當前值。

這適用於Firebug和Chrome。 以下是Chrome的一個示例：

Answer 2

“try-cache-finally”的答案也是正確的，但我想提供導致問題首先發生的答案。

當你有這個代碼時：

var b = [];
function a(callback) {
   if (b.length > 0) {
       return callback();
   }

   doXhr(function() {
       b.push("something");
   })
}

當你現在調用兩次然后第二次調用將看不到更新的a因為XHR請求仍在進行中，這會導致xhr請求被調用兩次。

對此的解決方案是等待回調，如下所示：

a(function() {
    a(function() {
        // Correct trigger
    });
});

所以實際上是基本的異步編程，但是這個錯誤是因為已經存在的代碼庫中存在這個bug並且很難追蹤。