Javascript学习笔记:闭包题解(4)

时间:2021-11-21 22:46:35

代码:

 1 var val1=0;
 2 var val2=0;
 3 var val3=0;
 4 
 5 for(var i1=1;i1<=3;i1++){
 6     var i2=i1;
 7     (function(){
 8         var i3=i2;
 9         setTimeout(function(){
10             val1+=i1;
11             val2+=i2;
12             val3+=i3;
13         },1);
14     })();
15 }
16 
17 setTimeout(function(){
18     console.log(val1);
19     console.log(val2);
20     console.log(val3);
21 },100)

问题:请写出该段代码打印出的结果。

正确答案:12,9,6

解析:setTimeout中的函数会在该段代码运行完之后运行,这是因为Javascript是单进程的,是事件循环模式运行的,setTimeout是将其中的函数在设定的时间之后加入到时间循环队列中,加入到队列之后还需要等待当前执行的函数同步代码执行完之后,才能执行通过setTimeout加入到队列的函数。然后再看i1,i2,i3,由于var是函数级作用域的,因此,i3在每次的匿名函数中都会重新定义,它的作用域只在当前的匿名函数中,因此最后的setTimeout函数中使用的i3是1、2、3,i2和i1都位于全局作用域中,不同的是i1最后比i2多加了一次,因此i1最后的值为4,i2最后的值为3。所以val1=3*i1=12,val2=2*i2=9。