Почему в цикле for с var и setTimeout в консоль попадает конечное значение счётчика и как получить корректные значения, не заменяя var на let?

Когда вы объявляете переменную через var внутри цикла for, она не создаётся заново на каждой итерации. Вместо этого существует одна переменная в области видимости функции (или глобальной), которая просто перезаписывается. Колбэки, переданные в setTimeout, захватывают ссылку на эту единственную переменную, а не её значение на момент вызова.

Почему так происходит

Цикл выполняется синхронно и очень быстро, а колбэки setTimeout попадают в очередь задач и выполняются только после того, как стек вызовов опустеет. К этому моменту цикл уже завершён, и переменная i равна конечному значению. Все колбэки читают одно и то же актуальное значение.

for (var i = 0; i < 3; i++) {
  setTimeout(function() {
    console.log(i); // 3, 3, 3
  }, 0);
}

Как исправить без let

Нужно создать новую область видимости для каждой итерации, чтобы каждый колбэк захватывал свою собственную переменную. Это можно сделать несколькими способами.

• IIFE (немедленно вызываемая функция): передаём текущее значение i как аргумент, создавая локальную копию.
• Функция-обёртка: выносим создание таймера в отдельную функцию, которая принимает значение.
• Метод bind: привязываем значение к функции через bind.

// Вариант 1: IIFE
for (var i = 0; i < 3; i++) {
  (function(j) {
    setTimeout(function() {
      console.log(j); // 0, 1, 2
    }, 0);
  })(i);
}

// Вариант 2: функция-обёртка
function logLater(j) {
  setTimeout(function() { console.log(j); }, 0);
}
for (var i = 0; i < 3; i++) {
  logLater(i);
}

Практическое применение

Понимание этого поведения важно при работе с асинхронным кодом, обработчиками событий и любыми колбэками внутри циклов. Даже если вы используете let, полезно знать, почему он решает проблему: let создаёт новую привязку на каждой итерации, и каждый колбэк замыкается на свою переменную.

Итог: используйте IIFE или функцию-обёртку, когда нужно зафиксировать значение переменной var на момент итерации; в современном коде предпочтительнее let, который делает это автоматически.