помогите разобраться с кодом. Данный код должен печатать цифры от 100 до 0 с задержкой в 20 мс.
Однако при запуске код сто раз печатает цифру "0", с задержкой 20 мс., переменная margin всегда === 0.
const move = (element) => {
let margin = 100;
let i = 0;
while (margin > 0) {
i++;
margin -= 1;
setTimeout(()=> {
console.log(margin);
}, 20*i)
}
}
move();
Пока писал пост, родилась мысль.
const move = (element) => {
let margin = 100;
let i = 0;
while (margin > 0) {
i++;
margin -= 1;
setTimeout((margin)=> {
console.log(margin);
}, 20*i, margin)
}
}
move();
Первый код работает неверно, потому что когда первая callback функция попадает из очереди задач в стэк, только тогда console.log() запрашивает значение margin. К этому моменту цикл уже отработал и margin === 0.
Во втором варианте на каждой итерации актуальное значение margin передаётся в функцию setTimeout.
Правильно ли я понимаю, что setTimeout() уходит в какую-то очередь с актуальным значением margin, потом через 20 мс. передаёт callback функцию в callback queue с аргументом margin. Потом функция с правильным аргументом попадает в стэк и там выполняется. Мы видим 99, 98 и т.д. ???
setTimeout(function bubu() { console.log(margin); if( --margin >= 0 ) setTimeout(bubu, 20); }, 20);`
– OPTIMUS PRIME Jan 02 '20 at 13:46