Why stored function will always refer to the value of the updated global i variable?

Question

var printNumTwo;
for (var i = 0; i < 3; i++) {
  if (i === 2) {
    printNumTwo = function() {
      return i;
    };
  }
}
console.log(printNumTwo());

Why the printed value of i is 3 instead of 2?

Answer 1

Because of var keyword, when you use var keyword for loop, It replace value instead of create a new value, where i created once and replaced by i on each iteration... you should use let or const to expect your desire output.

example:

using let keyword

for (let i = 0; i < 3; i++) {
    setTimeout(() => console.log(i), i * 100)
}

Here we used var keyword

for (var i = 0; i < 3; i++) {
    setTimeout(() => console.log(i), i * 100)
}

In Another word, In JavaScript using var keyword to declare a variable create a variable in function or closure scope, instead of block scope.