鍍金池/ 問答/HTML5  網(wǎng)絡安全  HTML/ 關于underscore源碼中throttle函數(shù)的疑惑?

關于underscore源碼中throttle函數(shù)的疑惑?

_.throttle = function(func, wait, options) {
    var context, args, result;
    var timeout = null;
    var previous = 0;
    if (!options) options = {};
    var later = function() {
      previous = options.leading === false ? 0 : _.now();
      timeout = null;
      result = func.apply(context, args);
      if (!timeout) context = args = null;
    };
    return function() {
      var now = _.now();
      if (!previous && options.leading === false) previous = now;
      var remaining = wait - (now - previous);
      context = this;
      args = arguments;
      // 如果超過了wait時間,那么就立即執(zhí)行
      if (remaining <= 0 || remaining > wait) {
        if (timeout) {
          clearTimeout(timeout);
          timeout = null;
        }
        previous = now;
        result = func.apply(context, args);
        if (!timeout) context = args = null;
      } else if (!timeout && options.trailing !== false) {
        timeout = setTimeout(later, remaining);
      }
      return result;
    };
  };

如上所示,在underscore中可以傳入leading為false來控制第一次是否立即執(zhí)行,那么我想問一下if (!previous && options.leading === false) previous = now;這句到底是什么意思?為什么options.leading為false的時候每次都要把now賦值給previous?這樣now - previous不是必然為0?這樣remaining就是wait了。
但是在options.leading不為false,也就是第一次立即執(zhí)行的時候,為什么previous卻是上次執(zhí)行的later函數(shù)里面記錄的時間,這個時候now - previous肯定是大于0的,這樣remaining豈不是永遠小于wait?
為什么這兩種情況下最后的remaining值卻不一樣?這是怎么處理的?

回答
編輯回答
笑浮塵

!previous條件被你吃了?怎么會每次都為now呢?

2017年5月16日 19:53
編輯回答
舊城人

其實從代碼上來看,當設置了option.leading=false的時候:

  1. 首次調(diào)用函數(shù)時,previous=now,即remaining=wait,所以會延遲wait時間調(diào)用
  2. 在延遲的wait時間內(nèi),previous維持在上次的now值,也就是函數(shù)調(diào)用的時間,無法調(diào)用函數(shù)
  3. 在wait時間過后,setTimeout回調(diào)later,又previous=0
  4. 下次調(diào)用函數(shù)的時候,由于previous===0,因此又有previous=now,回到步驟1

也就是在設置了option.leading=false的時候,不只是令首次函數(shù)調(diào)用被延遲,而是每一次函數(shù)調(diào)用都被延遲。

至于remaining的值,始終為要調(diào)用還需要等待的時間。函數(shù)的延遲調(diào)用方式是通過修改previous的賦值方式來控制的。

下面是官方的文檔:

By default, throttle will execute the function as soon as you call it for the first time, and, if you call it again any number of times during the wait period, as soon as that period is over. If you'd like to disable the leading-edge call, pass {leading: false}

翻譯一下就是:

默認情況下, throttle返回的函數(shù)在你第一次調(diào)用的時候都會盡快執(zhí)行, 并且, 不管你在延遲期內(nèi)調(diào)用函數(shù)多少次(都會失效), 直到延遲期結(jié)束. 如果你想要禁止首次調(diào)用, 傳遞參數(shù) {leading: false}

然而我覺得這個文檔很有問題。因為第一次調(diào)用也沒有被禁止,而是被延遲了。后續(xù)的所有函數(shù)調(diào)用也都變成了延遲調(diào)用的形式。如果有什么不對的地方希望可以跟我交流一下。

2018年6月6日 12:21