Couldn't understand how closure works in JavaScript

Asked May 29 '14 at 11:13

Active May 29 '14 at 11:23

Viewed 39 times

for ( var i = 0; i < 5; i++ ) {
    setTimeout(function() {
        alert( i );
    }, i * 100 ); 
}

I took the above example from the internet to understand closures. But I could not understand why it alerts value 5 for 5 times. Instead of alerting 1,2 3,4 ,5.
But the following way can be done. Can someone explain why. I am new to JavaScript so please provide some elaborate answers.

var createFunction = function( i ) {
    return function() {
        alert( i );
    };
};

for ( var i = 0; i < 5; i++ ) {
    setTimeout( createFunction( i ), i * 100 );
}

edited May 29 '14 at 11:23

Sambruce Sam

asked May 29 '14 at 11:13

user3601733

actually i need to understand how the above example work – user3601733 May 29 '14 at 11:15
In the same way as all others. Please read carefully a dozen of answers in the related question, and if you still have any question feel free to ask. – VisioN May 29 '14 at 11:17
yeah thanks but i need to know why my 1 st example prints value 5, 5 times instead of printing 1,2,3,4,5 – user3601733 May 29 '14 at 11:19
Because `alert(i)` uses the `i` variable from the scope of a `for` loop, and not from the scope of a closure. In the second example you pass `i` to a function, which "locks" it inside on each iteration. – VisioN May 29 '14 at 11:25
http://stackoverflow.com/a/17200991/918959 – Antti Haapala -- Слава Україні May 29 '14 at 11:26
@VisioN you are confusing him too. There is no scope for a `for` loop. – Antti Haapala -- Слава Україні May 29 '14 at 11:26
@AnttiHaapala By scope of a `for` loop I mean the scope where the `for` loop is located. – VisioN May 29 '14 at 11:27
cu both confuse me can u provide detail anser thanx – user3601733 May 29 '14 at 11:42

Couldn't understand how closure works in JavaScript

0 Answers0