Как var и let ведут себя в циклах с Promise и таймером?

Условие

В браузере выполните:

for (var i = 0; i < 2; i++) setTimeout(() => console.log('v', i), 0);
for (let j = 0; j < 2; j++) Promise.resolve().then(() => console.log('l', j));
console.log('end');

Определите значения и порядок.

Ответ

Вывод: end, l 0, l 1, v 2, v 2. Var создаёт одну общую переменную цикла, а let — отдельную привязку для каждой итерации; реакции Promise идут раньше таймеров.

Когда отложенные callbacks с var получают управление, цикл уже завершён и i равна 2. У каждого callback с let сохранена своя привязка j. Замена таймера на Promise не исправляет проблему общей var сама по себе: асинхронные callbacks всё равно читают переменную после синхронного завершения цикла.

Источник: developer.mozilla.org.