5

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"]

Community
  • 1
  • 1
antony.trupe
  • 10,640
  • 10
  • 57
  • 84
  • There may be more authoritative answers on similar questions: http://stackoverflow.com/questions/4198912/bizarre-console-log-behaviour-in-chrome-developer-tools , http://stackoverflow.com/questions/11214430/wrong-value-in-console-log , http://stackoverflow.com/questions/11118758/bug-in-console-log –  Oct 09 '12 at 03:38
  • http://stackoverflow.com/questions/4057440/is-chromes-javascript-console-lazy-about-evaluating-arrays?lq=1 –  Oct 09 '12 at 03:43
  • do we have a bunch of duplicate questions for this issue? – antony.trupe Oct 09 '12 at 03:58

1 Answers1

6

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.

Community
  • 1
  • 1
  • that does indeed appear to be the case. do you have a reference for that? – antony.trupe Oct 09 '12 at 03:24
  • @antony.trupe Unfortunately, no :( –  Oct 09 '12 at 03:24
  • If it is a bug, then should it be submitted to [crbug.com](http://crbug.com/)? – Derek 朕會功夫 Oct 09 '12 at 03:26
  • @Derek I don't think it's a "bug" so much as "unexpected quirk" - or, "undocumented feature" ;-) –  Oct 09 '12 at 03:27
  • The Chrome console can be tricky, it just doesn't snapshot objects or elements immediately when logging to the console. You might think an object obviously had a property at the time the code ran when in fact it happened later: http://jsfiddle.net/RY6gc/1/ – TheZ Oct 09 '12 at 03:28
  • 1
    @Derek [someone else thought this a bug too](http://code.google.com/p/chromium/issues/detail?id=50316) –  Oct 09 '12 at 03:42
  • 2
    For objects and arrays, if the exact timing of the `console.log()` is important, then you need to convert your output to a string before calling `console.log()` and then this problem won't happen. – jfriend00 Oct 09 '12 at 03:42
  • @pst - Maybe because it *is*? – Derek 朕會功夫 Oct 09 '12 at 03:42
  • 2
    looks like webkit fixed it and its is in the process of propagating downstream from http://trac.webkit.org/changeset/125174 – antony.trupe Oct 09 '12 at 03:56
  • @antony.trupe Neat, added some references to the post. –  Oct 09 '12 at 04:26