Неправильный длина массива в цикл

Question

я столкнулся странное поведение в цикле, который содержит массив объектов

Ниже приведен пример

var store = {}; 
var storesWithTimestamps = []; 

for (var i=0;i<2;i++){      
    console.log("inital list",storesWithTimestamps); //1 
    console.log("inital length",storesWithTimestamps.length); //2 

    store = {}; 
    store.latestTimestamp = null; 
    store.storeName = "testStore"; 
    storesWithTimestamps.push(store); 

    console.log("new list",storesWithTimestamps); //3 
    console.log('new length',storesWithTimestamps.length); //4 
} 

Проблема журнала утверждение 3 показывает массив объекта с 2-мя элементами в 1-й итерации, но оператор журнала 4 показывает длину как 1.

Результат оператора 3 журнала одинаковый для обеих итераций, как это, [{latestTimestamp: null, storeName : "testStore"}, {latestTimestamp: NUL л, StoreName: "testStore"}]

Где, как это должно быть первая петля:

[{latestTimestamp:null,storeName:"testStore"}] 

второй цикл:

[{latestTimestamp:null,storeName:"testStore"},{latestTimestamp:null,storeName:"testStore"}] 

FYI: это работает, как ожидается, в Safari, но не на хром - OSX Прикрепленный скрипку: http://jsfiddle.net/gauravsoni/09Ls3rtx/

Прикрепленный скриншот:

Answer 1

На самом деле это связано с поведением отладчика .

Если отладчик открыт при запуске скрипта, вывод в консоли будет правильным.

Если отладчик не открывается при запуске скрипта, объект оценивается во время отображения консоли. Вот почему вы можете видеть 2 объекта в массиве.

Я думаю, что это означало @yorlin.

Добавление: Вы можете использовать метод JSON.stringify() для входа мгновенных свойств объекта:

console.log("inital list:", JSON.stringify(storesWithTimestamps)) //1 
... 
console.log("new list:", JSON.stringify(storesWithTimestamps)) //3 

Nota Bene: В консоли курсивного значения были оценены мгновенно, в то время как неиалистические значения оцениваются, когда они отображаются (как вы можете видеть в синем [i] рядом со значениями).

Заключение: Во втором опубликованном скриншоте мы ясно видим, что это не ошибка Chrome.

Answer 2

Я пробовал это ... Как и @yorlin и @Supersharp.

Вы можете проверить его на консоли более ясно.

var store = {}; 
var storesWithTimestamps = []; 

//Checkout the status of ary 
function displayObj(objAry){ 
    var info="\n"; 
    for(var i=0;i<objAry.length;i++){ 
     var data=objAry[i]; 
     info+='\t\trecord('+i+').id:'+data.id+'\n'; 
    } 
    return info; 
} 

for (var i=0;i<2;i++){      
    console.log("inital list",storesWithTimestamps); //1 
    console.log("inital length",storesWithTimestamps.length); //2 

    //put an id to identify 
    store = {id:i}; 
    store.latestTimestamp = null; 
    store.storeName = "testStore"; 
    storesWithTimestamps.push(store); 

    console.log("new list",displayObj(storesWithTimestamps)); //3 
    console.log('new length',storesWithTimestamps.length); //4 
} 

Answer 3

Это происходит из-за асинхронного характера консоли.LOG() вы можете найти более подробную информацию относительно этого поведения на console.log() async or sync?

вы можете попробовать обходной путь для входа в нужное значение, как показано ниже -

var store = {}; 
 
var storesWithTimestamps = []; 
 

 
for (var i=0;i<2;i++){      
 
    console.log("inital list",storesWithTimestamps); //1 
 
    console.log("inital length",storesWithTimestamps.length); //2 
 

 
    store = {}; 
 
    store.latestTimestamp = null; 
 
    store.storeName = "testStore"; 
 
    storesWithTimestamps.push(store); 
 

 
    console.log("new list",JSON.stringify(storesWithTimestamps)); //3 instead of passing object, pass serialized snapshot of the object 
 
    console.log('new length',storesWithTimestamps.length); //4 
 
}