Why this output 3 instead of 2?

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

I understand that there is only one i in this snippet, and it is a global one.
But why does it return 3?
I thought the loop stopped at 2?
If the loop stopped at 2 why the global i is three?

2 Likes

ah… i see.

for(var i = 0, i<3;i++)

carries out like this:

i === 0, is it less than 3? yes i ===1 now
i === 1, is it less than 3? yes i ===2 now
i === 2, is it less than 3? yes i ===3now

then stopped.

is this correct?

2 Likes

i see. thanks!
(20 characters)

Hi i have a similar doubt.

Wont the return statement act as a break statement inside the function?

And the value of printNumTwo being stored when i === 2 so when we do console.log(printNumTwo) wont it be saved as 2?

1 Like

i guess because the return is inside the anonymous function it wont break out from the for loop. but if their is a return statement in the if statement too , i++ will not happen one more time

sometimes it is difficult to get all the logic behind all these snippet isnt it?

I feel it sometimes cos some stuff I just cant get it to work. :wink:

thinking with a fresher mind always helps :slight_smile:

1 Like

so in the above example, the function will get executed when i === 2 but it will only break out of the function right and continue along… however if we add a break statement in the if statement after the function passes, then it breaks out of the for loop as well. Can we somehow make it break out of the for loop my defining a break or return inside the function ? i think thats what im confused about

so basically when the for loop breaks then the function gets executed and thats why it returns value as 3.

I don’t understand the meaning of this line of code " printNumTwo = function(); "
Sir i don’t understand the behaviors of loop.
Please comment on my understanding of for loop whether i understood correct or not.
for(var i = 0 ; i < 3 ; i++)

  • List item
  1. First " i" initialize to 0;
  2. After than i checked with 3 whether less then or not if condition is true then it start executing code of inside the FOR loop.
  3. After the completion on code inside the for loop.The value of " i " variable is incremented by " i++ ".

Based on the first code:

var numArray = [];
for (var i = 0; i < 3; i++) {
  numArray.push(i);
}
console.log(numArray);
// returns [0, 1, 2]
console.log(i);
// returns 3

First Iteration
i = 0
i < 3 // 0 < 3 --> true
.push(i) // --> [0]
i++; // now i = 1

Second Iteration
i = 1
i < 3 // 1 < 3 --> true
.push(i) // --> [0, 1]
i++; // now i = 2

Third Iteration
i = 2
i < 3 // 2 < 3 --> true
.push(i) // --> [0, 1, 2]
i++; // now i = 3

Fourth Iteration
i = 3
i < 3 // 3 < 3 --> false
//There is not a .push(i), the condition was false

So the code ends and you can note that the value of i is 3.

About printNumTwo = function(); I recommend you to read about function declaration and function expressions.

In this snippet,

printNumTwo = function() {
      return i;
    };

is printNumTwo a function?
Cuz, i only know that functions can be created by:

funtion printNumTwo()
{return i;}

are these two the same thing?

1 Like