一道面试题的分析理解

 

 

 

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

        setTimeout(() => {

            console.log(i)

        },500);                                                              var 定义的是全局变量.

        console.log(i);            //输出: 0,1,2 ,3,3,3     由于js单线程,循环完之后,执行定时器队列. 这时i=3,所以

    }                                                                            输出 3,3,3    如何解决?

    

 

 

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

        (function (i){

            setTimeout(() => {

                console.log(i)

            },500);

        })(i);

        console.log(i);          //输出: 0,1,2,0,1,2      创建私有作用域, 在每次循环中, 将i值传递到私有作用    

    }                                                      域中,  这样私有作用域中的定时器执行时,就会使用传进来的参数值i.

                                                           私有作用域中的i值不会受到外部影响.所以输出:0,1,2

  

 

 

for(let i=0;i<3;i++){

        setTimeout(() => {

            console.log(i)

        },500);

        console.log(i);         //输出: 0,1,2,0,1,2        用let定义变量.let定义的变量作用域只在{}块中

  }                                                                       定时器在执行时,

                                                    读取块中的局部变量i, 不受外部影响, 所以输出:0,1,2

    

 

总结:

    var定义的是全局变量

 

    js 单线程, 执行完逻辑后,才执行定时器队列

 

    解决方法:  要么   定义成局部变量.定时器执行时,直接使用的局部变量.

                     

                     要么   创建私有作用域,将每次循环的i值传递到私有作用域中.

                               在私有作用域, 传递进来的i值, 相当于局部变量.