Нужно выводить результат работы скрипта на страницу через заданные интервалы времени (например, 1000 мс). Есть функция, которая перебирает объекты в массиве, и при совпадении условия выводит характеристики объекта. Собственно, код:
function sleep(ms) {
let t = (new Date()).getTime();
let i = 0;
while (((new Date()).getTime() - t) < ms) {
i++;
}
}
function isNew_Car(obj) {
sleep(1000);
if (obj.year >= document.getElementById('year').value) {
GARAGE_NEW.push(obj);
document.getElementById('result').textContent += `
Name: ${obj.name}
Year: ${obj.year}
Price: ${obj.price}
<br>
`;
console.log(GARAGE_NEW);
}
}
function check_car() {
for (let i = 0; i< GARAGE.length; i++) {
isNew_Car(GARAGE[i])
}
}
В GARAGE хранится массив объектов вида
{name: "Honda", year: 2015, price: 12000}
Проблема вот в чем: пауза при выводе элементов на страницу игнорируется, они выводятся все скопом уже после того, как цикл прошелся по всему массиву. При этом для отладки попробовал выводить в консоль - всё четко, выводится раз в 1 секунду, проблема только с DOM. Вместо textContent пробовал передавать через innerHTML и createElement, результат аналогичный. Замена sleep() на setTimeout() тоже не дает нужного эффекта. Что я делаю не так и как это исправить?