Need help with simple code

[Kuzyo]

Hi guys;
Can’t figure out how to make this code work without Global variable i .

var i = 0;
function logNum() {
    i++;
    console.log( i );
}

var timerId = setTimeout(function loop() {
  logNum();
  timerId = setTimeout( loop, 100 );
  if ( i === 20 ) clearTimeout( timerId );
}, 100);

Can somebody give advice? Thanks

[whatsoever]

Try this out :)
It is the same code, you just have to wrap an IIAF around it.

(function () {
    var i = 0;
    function logNum () {
        i++;
        console.log(i)
    };

    var timerId = setTimeout(function loop() {
          logNum();
          timerId = setTimeout( loop, 100 );
          if ( i === 20 ) clearTimeout( timerId );
        }, 100);
}())

[Kuzyo]

Thanks, this solution I knew but if imagine that all my code already wrapped in immediately-invoked function.

[whatsoever]

In that case you might as well put your original code in the IIF, it would work.
There are a lot of ways to handle this, if your IIF returns a object, you could define ‘i’ and numLog inside the function and after that return them, like so:

var css_tricks = (function () {
    var i = 0;
    //some code

    function numLog() {
        i++;
        console.log(i);
        return i;
    }

    return {
        numLog: numLog
    }
}())

var timerId = setTimeout(function loop(){
    var i = css_tricks.numLog();
    timerId = setTimeout(loop, 100)
    if(i === 20) {
        clearTimeout(timerId)
    };
}, 100) 

It pretty much depends on the effect you are trying to achieve.

[Kuzyo]

Thanks, it’s nice solution. I’m in process of understanding clouser and other JS tricks and sometimes need help.

[Author]

Posts