chrome对象console.log中的奇怪行为

Question

当我尝试在Chrome中调用一个对象的console.log时，它在console.log的第一行中指出（在这里你看到对象{small summary here}我的posts数组长度为0（posts：Array [0 ]）。

然而，当我展开帖子时，它显示它有27个项目（这是我需要的）。

这种情况随机发生在我身上，我不知道为什么会发生这种情况，以前有人经历过这种情况吗？

截图：

更新：这种情况发生在所有浏览器中，因此可能与Chrome无关

Answer 1

调试器无法知道对象是否已被更改，这就是posts属性的渲染（在您的示例中）尚未更新的原因。即使调试器能够知道属性何时被更改，每次更新它（并且所有＆＃34; loggings＆＃34;）都会太昂贵。

因此调试器只有在明确访问它时才会检查属性。

在这种情况下，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]

在我看来，记录器没有必要更新对象值，因为变量监视已经具有此功能。在那里，您可以始终更新变量的当前值。

这适用于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
    });
});

所以实际上是基本的异步编程，但是这个错误是因为已经存在的代码库中存在这个错误并且很难追踪。