Почему так происходит (кратко): переменная `var i` — функциональная (не блочная), поэтому в цикле используется одна и та же переменная. Колбэки `setTimeout` выполняются позже, когда цикл уже завершён и `i` равно $3$. В результате в консоль выводится $3,3,3$.
Как получить вывод $0,1,2$ (несколько современных способов):
1) Блочная переменная `let` в заголовке цикла:
for (let i=$0$; i<$3$; i++) { setTimeout(()=>console.log(i), $0$); }
2) Захват значения в замыкании (IIFE):
for (var i=$0$; i<$3$; i++) {
(function(j){ setTimeout(()=>console.log(j), $0$); })(i);
}
3) Передать значение как аргумент таймеру (или использовать bind):
for (var i=$0$; i<$3$; i++) { setTimeout(console.log, $0$, i); }
или
for (var i=$0$; i<$3$; i++) { setTimeout((x)=>console.log(x), $0$, i); }
Короткое пояснение: даже задержка $0$ ставит выполнение в очередь задач, поэтому колбэки выполнятся после окончания цикла; `let` создаёт новую привязку `i` для каждой итерации, а остальные способы явно фиксируют текущее значение.