定时器机制

有趣的定时器

---

代码 01

直接上代码，不废话，例如：

          for (var i = 0; i < 5; i++) {
              console.log(i);
          }
          //0,1,2,3,4

输出0,1,2,3,4这肯定是没有问题

代码 02

          for (var i = 0; i < 5; i++) {
                    setTimeout(console.log(i),1000);
          }
          //0,1,2,3,4

这题目与代码01是没有什么区别的

代码 03

          for(var i = 0; i < 5; i++) {
                    setTimeout(function(){
                              console.log(new Date(),i);
                    },1000);
          }
          //Sun Jan 28 2018 10:50:52 GMT+0800 (中国标准时间) 5
          //Sun Jan 28 2018 10:50:52 GMT+0800 (中国标准时间) 5
          //Sun Jan 28 2018 10:50:52 GMT+0800 (中国标准时间) 5
          //Sun Jan 28 2018 10:50:52 GMT+0800 (中国标准时间) 5
          //Sun Jan 28 2018 10:50:52 GMT+0800 (中国标准时间) 5

这道题并没有输出0,1,2,3,4,5
这是因为异步处理，等待1秒的时间，同事触发5个定时器，输出的都是最后一个值。

代码 04

          for (var i = 0; i < 5; i++) {
                    setTimeout(function() {
                              console.log(i);
                    }, 1000);
          }
          //5,5,5,5,5

等待1秒，立马输出5个5，定时器如果第一个参数的回调函数的话，也会立马触发5个定时器，由于单线程的操作，会输出循环最后一个数值。所以是5个5

          for (var i = 0; i < 5; i++)
          {
                    (function(j) {
                              setTimeout(function() {
                                        console.log(new Date, i);
                              }, 1000);
                    })(i);
          }
          console.log(new Date, i);
           //Sun Jan 28 2018 13:30:55 GMT+0800 (中国标准时间) 5
           //Sun Jan 28 2018 13:30:55 GMT+0800 (中国标准时间) 5
           //Sun Jan 28 2018 13:30:55 GMT+0800 (中国标准时间) 5
           //Sun Jan 28 2018 13:30:55 GMT+0800 (中国标准时间) 5
           //Sun Jan 28 2018 13:30:55 GMT+0800 (中国标准时间) 5