Question

此代码：

foo = [{id: 1},{id: 2},{id: 3},{id: 4}, {id: 5}, ];
console.log('foo1', foo, foo.length);
foo.splice(2, 1);
console.log('foo2', foo, foo.length);

在Chrome中生成以下输出：

foo1 
[Object, Object, Object, Object, Object]  5
    0: Object
    1: Object
    2: Object
    3: Object
    length: 4
    __proto__: Array[0]
     5 (index):23
foo2 
[Object, Object, Object, Object]  4
    0: Object
    1: Object
    2: Object
    3: Object
    length: 4
    __proto__: Array[0]

小提琴：http://jsfiddle.net/2kpnV/

为什么？

Answer 1

通过console.log检查对象以异步方式进行。控制台同步接收对象的引用，但在扩展之前不显示对象的属性（在某些情况下，取决于浏览器以及在日志发生时是否打开开发工具）。如果在控制台中检查对象之前修改了对象，则显示的数据将具有更新的值。

例如，Chrome会在一个框中显示一点i，当它悬停时，会说：

记录时左边的对象值被快照，刚刚评估了下面的值。

让你知道你在看什么。

登录这些情况的一个技巧是记录单个值，或者JSON编码对象引用：

console.log(obj.foo, obj.bar, obj.baz);
//or
console.log(JSON.stringify(obj));

Answer 2

重新定义console.log将解决问题。

var originalLog = console.log
console.log=function(obj){
    originalLog(JSON.parse(JSON.stringify(obj)))
}

Answer 3

您可以在对象修改后放置 setTimeout 来运行。

setTimeout(()=>{
    console.log(this.daysOfTheYear)
},0)

对象的奇怪行为＆amp;的console.log

3 个答案: