Question

Possible Duplicate:
Is Chrome's JavaScript console lazy about evaluating arrays?

Chrome’s js console is showing an array with a deleted value before the value is deleted. Why?

jsFiddle that demonstrates this behavior.

var list=[];
list.push("one");
list.push("two");
list.push("three");
console.log(list);                        //["two", "three", undefined × 1] 
$("#output").append(JSON.stringify(list));//["one","two","three"]

list.shift();

$("#output").append($("<br>"));

console.log(list);                        //["two", "three"] 
$("#output").append(JSON.stringify(list));//["two","three"]

​

Answer 1

In Chrome console.log is "delayed"; in this case to the end of the Program I believe.

That is, in Chrome, console.log does not stringify the input object immediately but rather performs the stringification "some time later" (after which the object has been modified in this case) but before it actually displays the result,

console.log(JSON.stringify(list)) would show the expected result.

---

This was reported as a bug as far back as Chrome 5 (the bug-fix target is Mstone-22, so not Chrome 20/21?) and a fix has been added to the webkit base:

As of today, dumping an object (array) into console will result in objects’ properties being read upon console object expansion (i.e. lazily). This means that dumping the same object while mutating it will be hard to debug using the console.

This change starts generating abbreviated previews for objects / arrays at the moment of their logging and passes this information along into the front-end. This only happens when the front-end is already opened, it only works for console.log(), not live console interaction.