0

It is said that "RETURN" statement terminates a for loop in javascript but in this case the code will still output 3 why? does that mean the return statement doesn't terminate the loop?

var printNumTwo;
for (var i = 0; i < 3; i++) {
  if (i === 2) {
    printNumTwo = function() {
      return i;
    };
  }
}
console.log(printNumTwo());
Jeremy Thille
  • 26,047
  • 12
  • 43
  • 63
ife
  • 33
  • 5
  • Because the for loop will break when `i === 3` and that's why the fuction return 3; – Alon Eitan Dec 31 '21 at 09:02
  • 5
    When `i===2` you define a function that returns `i`, whatever its value. Very well. Then the loops keeps going. Now `i===3`, the loop is over, that part is done. Now you execute `printNumTwo()` when `i===3`, so it outputs `3`. The `return` statement is _not_ in your `for` loop. It is inside a function defined inside your `for` loop. – Jeremy Thille Dec 31 '21 at 09:05
  • 1
    `return` doesn’t specifically terminate a loop; it terminates the closest containing function. If `return` _happens_ to be in a loop, which is inside the function being terminated, then `return` terminates the function in the middle of the loop. Your function being terminated is `printNumTwo`. You only execute this function after the loop is done. The `return` doesn’t touch your loop. – Sebastian Simon Dec 31 '21 at 09:07
  • As pointed out in the answers, there’s an orthogonal problem going on: [JavaScript closure inside loops – simple practical example](/q/750486/4642212). – Sebastian Simon Dec 31 '21 at 09:30

3 Answers3

1

@jeremy-thille explained how the loop continues and i becomes 3. Additionally, this occurs, because i is not scoped within the loop. If you use let to assign i, it is scoped within the loop (block-scoped), and the result would be as expected.

let printNumTwo;
for (let i = 0; i < 3; i += 1) {
  if (i === 2) {
    printNumTwo = () => i;
  }
}

console.log(printNumTwo());
KooiInc
  • 119,216
  • 31
  • 141
  • 177
0

You can add console.log to understand. Since, printNumTwo = function(){} is definition of function not execution. You can try other example:

var printNumTwo;
for (var i = 0; i < 3; i++) {
  console.log('before', i);
   printNumTwo = function() {
      console.log('end', i);
      return i;
    };
  if (i === 2) {
    console.log('process', i);
  };
  console.log('after', i);
}
console.log(printNumTwo());
/* ouput
> "before" 0
> "after" 0
> "before" 1
> "after" 1
> "before" 2
> "process" 2
> "after" 2
> "end" 3
> 3
*/
Viettel Solutions
  • 1,519
  • 11
  • 22
0

You have defined the i variable in for loop with the var keyword. var has function scope and due to this when the for loop runs, i will be increased to 3 and then it will check for condition and exit the for loop but it will be assigned value 3 to i in the global scope.

To get 2 as the output you have to define i with the let keyword that has block scope and the last fetched value will be provided when the function runs.

var printNumTwo;
for (let i = 0; i < 3; i++) {
  if (i === 2) {
    printNumTwo = function() {
      return i;
    } 
  }
}
 console.log(printNumTwo());
Zsolt Meszaros
  • 21,961
  • 19
  • 54
  • 57
ravi jhalani
  • 1
  • 1