objetos y console.log: una rareza desordenada

cuando trabaja con objetos y console.log, puede encontrar un comportamiento peculiar. Desenvuelvamos este misterio analizando este fragmento de código:

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);

en Chrome, esto produce la salida inesperada:

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]

El examen asincrónico

la clave para comprender este comportamiento se encuentra en la naturaleza asíncrona del examen de objetos a través de console.log. Mientras que la consola recibe una referencia al objeto sincrónicamente, no muestra sus propiedades hasta que la expande manualmente.

la sorpresa variable de instancia

cuando se expande un objeto después de que se haya modificado, ve los valores actualizados en lugar del estado original. Esto ocurre asincrónicamente, lo que lleva a la salida aparentemente ilógica.

técnicas de depuración

para evitar esta inconsistencia, considere estas técnicas de depuración:

log la registro de valores individuales:
• las propiedades de los objetos (e.g. console.log (obj.foo, obj.bar, obj.baz);)
JSON ENCODE:
• Transforme el objeto en una cadena usando json.stringify (obj) Intelligent profundo: