Perché console.log() non cattura un'istantanea delle variabili passate?

Question

Oggi mi sono imbattuto in un comportamento davvero strano con javascript. Penso di averlo capito in qualche modo ora, ma mi piacerebbe sapere se ciò che penso stia accadendo davvero o se ci sia qualche altra magia coinvolta. Quindi questo è il mio codice:

var SomeObject = {}; 

    SomeObject.foo = function(a, b) { 
     var baz = this.bar(a, b); 
     console.log(baz); 
     console.log(baz.left); 
     SomeObject.magicalStuff(baz); 
    }; 

    SomeObject.bar = function(a, b) { 
     return {left: a-b, top: b-a}; 
    }; 

    SomeObject.magicalStuff = function(position) { 
     position.left = 0; 
    }; 

    SomeObject.foo(100, 50); 

The code at jsFiddle

L'uscita di questo è qualcosa di simile (a seconda del browser):

> Object 
50 

Se si espande il "oggetto" (in Chrome, Safari o Firefox (Firebug) quello che ottieni è:

> Object 
    left: 0 
    top: -50 

Considerando che mi aspetto:

> Object 
    left: 50 
    top: -50 

Quello che penso sta succedendo è che console.log() in realtà solo "messaggi", un riferimento alla console, che viene letta una volta che si fa clic sul simbolo "espandere". Ma questo tipo di sconfiggere lo scopo di console.log() non è uno strumento di debug? Mi sono sempre aspettato console.log() per "fare lo snapshot" del materiale che ho passato. È davvero sorprendente vedere un'istruzione che viene dopo che l'effettivo console.log() cambia l'output di quella stessa chiamata a console.log().

Oppure c'è qualcos'altro?

Modifica: Mi chiedo anche se ci sia un motivo valido per gli sviluppatori di browser per implementare console.log come questo (suppongo ce ne sia uno, altrimenti non sarebbe coerente nei principali browser).

Answer 1

C'è console.dir() per quello che vuoi in Firebug.

In generale, non è possibile stampare ogni livello di proprietà nidificate, dal momento che gli oggetti possono contenere riferimenti circolari come var a = {}; var b = {a: a}; a.b = b;

L'implementazione di un metodo perfetto clone è molto difficile - credo che avrebbe dovuto fondamentalmente solo scaricare tutta la memoria e il logging richiederebbe molto tempo. Pensa a console.log(window) ...

Answer 2

Ho anche visto questo comportamento e sicuramente sembra che venga pubblicato un riferimento. Per aggirare questo ho usato il metodo clone() in jQuery sulle cose che volevo registrare.

Answer 3

Sì, questo è quello che sta succedendo. Immagino sia fatto per minimizzare il sovraccarico delle chiamate console.log(). Le cose potrebbero andare fuori controllo se ogni oggetto è stato clonato in profondità per ogni chiamata di registro.

Quando è necessario risolvere il problema, è possibile eseguire l'operazione JSON.stringify() o clonare l'oggetto prima di passarlo a console.log().