摘要：關(guān)于定時(shí)器的源碼在文件中，進(jìn)入就關(guān)于定時(shí)器的一些設(shè)計(jì)解釋，因?yàn)槭亲龇?wù)端代碼，在內(nèi)部等大部分事件都會創(chuàng)建一個(gè)定時(shí)器，任何時(shí)間都可能存在大量的定時(shí)器任務(wù)，所以設(shè)計(jì)一個(gè)高效的定時(shí)器是很有必要的。

博客文章地址

setTimeout 和 setInterval 是我們在 javaScript 中經(jīng)常用到的定時(shí)器,setTimeout 方法用于在指定的毫秒數(shù)后調(diào)用函數(shù)或計(jì)算表達(dá)式,setInterval 可按照指定的周期不停的調(diào)用函數(shù)或計(jì)算表達(dá)式。

但是當(dāng)我們要循環(huán)調(diào)用某任務(wù)時(shí)候,處了用 setInterval 指定周期外，我們也可以用函數(shù)中嵌套setTimeout 回掉自己來實(shí)現(xiàn), 可以看下面一段代碼

    // A
    function myTimeout() {
        doStuff()
        setTimeout(myTimeout, 1000)
    }
    myTimeout()
    
    // B
    function myTimeout() {
        doStuff()
    }
    myTimeout()
    setInterval(myTimeout, 1000)

上面A, B 兩個(gè)方法都是在循環(huán)執(zhí)行 myTimeout 函數(shù),可是它們之間有什么不同呢。我們大部分都知道這其實(shí)取決與 doStuff 所消耗的時(shí)間, 如下圖所示如果 doStuff 消耗時(shí)間很短(實(shí)際中大部分消耗時(shí)間都很短很難有所察覺),兩個(gè)方法效果近似

當(dāng)doStuff是一個(gè)很復(fù)雜的計(jì)算，需要消耗很長時(shí)間時(shí)候，我們就可以分析出A 方法（用setTimeout回掉）能夠保障每一次任務(wù)結(jié)束到下一次任務(wù)開始的時(shí)間間隔為我們預(yù)期的值，但是B(setInterval)卻能保證任務(wù)開始到下一次任務(wù)開始之間的間隔為我們預(yù)期的值，(當(dāng)然如果doStuff執(zhí)行時(shí)間比我們預(yù)期間隔還長，setInterval 還有可能會直接放棄某次任務(wù)，這種罕見情況我們暫不考慮)

為了感受其中的差異，這里定義一個(gè)模擬任務(wù)執(zhí)行的函數(shù)

    function wait(time) {
        var start = Date.now()
        while(Date.now() - start < time){}
    }

wait什么也沒做，但是卻可以阻塞進(jìn)程time毫秒的時(shí)間,然后我們定義 doStuff，讓它每次執(zhí)行阻塞進(jìn)程500ms,而且可以輸出間隔時(shí)間信息，以及本次執(zhí)行結(jié)束到下次執(zhí)行開始的時(shí)間間隔

    function doStuff() {
        console.log("doStuff___start", new Date().getSeconds()) //每次輸出當(dāng)前的秒數(shù)
            
        console.timeEnd("timeout") //每次輸出這次執(zhí)行與上一次執(zhí)行結(jié)束的時(shí)間間隔
        wait(500)
        console.time("timeout")
    }

然后我們分別運(yùn)行A, B兩種方法

    /*
     * A方法 setTimeout
     */
    // doStuff___start 36
    // timeout: 1002.865966796875ms
    // doStuff___start 37
    // timeout: 1004.380859375ms
    // doStuff___start 39
    // timeout: 1001.550048828125ms
    // doStuff___start 40
    // timeout: 1001.051025390625ms
    // doStuff___start 42
    // timeout: 1001.637939453125ms
    
    /*
     * B方法 setInterval
     */
    // doStuff___start 50
    // timeout: 500.412109375ms
    // doStuff___start 51
    // timeout: 500.51806640625ms
    // doStuff___start 52
    // timeout: 500.099853515625ms
    // doStuff___start 53
    // timeout: 499.873291015625ms
    // doStuff___start 54
    // timeout: 500.439697265625ms
    

可以看到 A 方法(用setTimeout回掉),我們保證了每次進(jìn)程結(jié)束到下一次進(jìn)程開始的間隔為預(yù)期值，但是從每次進(jìn)程開始的時(shí)間間隔(我們這里精確到了秒)是會改變的，而B 方法(setInterval)表現(xiàn)的和我們預(yù)期的相同，正好與A相反。

目前為止所以的表現(xiàn)都合理，至少很符合預(yù)期。可是當(dāng)我在 nodejs(v8.1.4) 中測試時(shí)候，卻發(fā)現(xiàn)不管我用 setTimeout 還是 setInterval ，他們總是能表現(xiàn)出同樣的效果(都是上面A方法的效果【用setTimeout回掉】)。這一點(diǎn)讓我很困惑,經(jīng)過一番探究，在 nodejs 關(guān)于 timers 的代碼中找到了答案。

nodejs 關(guān)于定時(shí)器的源碼在 node/lib/timer 文件中，進(jìn)入就關(guān)于定時(shí)器的一些設(shè)計(jì)解釋，因?yàn)?node 是做服務(wù)端代碼，在內(nèi)部 TCP, I/O.. 等大部分事件都會創(chuàng)建一個(gè)定時(shí)器，任何時(shí)間都可能存在大量的定時(shí)器任務(wù)，所以設(shè)計(jì)一個(gè)高效的定時(shí)器是很有必要的。

nodejs實(shí)現(xiàn)定時(shí)器也很巧妙, 為了可以輕松取消添加事件，nodejs使用了雙向鏈表將 timer 插入和移除操作復(fù)雜度降低，具體實(shí)現(xiàn)在 node/lib/internal/linkedlist.js 文件中, 鏈表缺點(diǎn)自然是去查找元素，但是node ,把同一個(gè)時(shí)間間隔的 timer 維護(hù)在同一個(gè)雙向鏈表中，這樣就不需要去查找，因?yàn)橄炔迦氲目偸窍葓?zhí)行，具體的分析可以參考這篇文章 通過源碼解析 Node.js 中高效的 timer.

回歸主題，在 nodejs 關(guān)于 timer 的源碼下，我們可以找到執(zhí)行定時(shí)器的代碼

    // setInterval 會返回 createRepeatTimeout 的返回值
    exports.setInterval = function(callback, repeat, arg1, arg2, arg3) {
      ...
      return createRepeatTimeout(callback, repeat, args);
    }
    
    //  createRepeatTimeout函數(shù)生成timer
    function createRepeatTimeout(callback, repeat, args) {
      repeat *= 1; // coalesce to number or NaN
      if (!(repeat >= 1 && repeat <= TIMEOUT_MAX))
        repeat = 1; // 這里間隔如果小于1或者大于TIMEOUT_MAX（2^31-1）都會按照1計(jì)算
      var timer = new Timeout(repeat, callback, args);
      timer._repeat = repeat; // 追加了_repeat屬性表示要循環(huán)調(diào)用
      ...
    
      return timer;
    }
    

    // 函數(shù)回掉時(shí)，可以看到執(zhí)行時(shí)在ontimeout函數(shù)中
    function tryOnTimeout(timer, list) {
        ...
             try {
                ontimeout(timer);
                threw = false;
              } finally {
                if (timerAsyncId !== null) {
                  if (!threw)
                  ...
                }
        ...
    }
    
    // ontimeout執(zhí)行
    function ontimeout(timer) {
      var args = timer._timerArgs;
      var callback = timer._onTimeout;
      if (typeof callback !== "function")
        return promiseResolve(callback, args[0]);
      if (!args)
        timer._onTimeout();
      else {
        switch (args.length) {
          case 1:
            timer._onTimeout(args[0]);
            break;
          case 2:
            timer._onTimeout(args[0], args[1]);
            break;
          case 3:
            timer._onTimeout(args[0], args[1], args[2]);
            break;
          default:
            Function.prototype.apply.call(callback, timer, args);
        }
      }
      if (timer._repeat) // 追加timer
        rearm(timer);
    }

上面代碼分析，可以看到追加循環(huán)調(diào)用是在 ontimeout 函數(shù)中，它里面一大堆判斷參數(shù)個(gè)數(shù)的內(nèi)容可以不管，最后的if(timer._repeat) rearm(timer)判斷是否要循環(huán)調(diào)用，可以看到它是在上面 timer._onTimeout 執(zhí)行完之后才去執(zhí)行的。這和我們開始寫的A方法（用setTimeout回掉）基本類似，至此在 nodejs 表現(xiàn)出的不同就可以理解了。

看 issues , 關(guān)于這個(gè)問題也有很多討論，還是有不少人想把它改會我們熟悉的方式的

setTimeout interval should not include duration of callback

setInterval interval includes duration of callback

具體最后要怎樣還是要看后面的版本修改了。

nodejs源碼

setTimeout or setInterval?

JavaScript的setTimeout和setInterval的深入理解