setTimeout 和 throttle 那些事兒

    document.querySelector('#settimeout').onclick= function () {
        setTimeout(function () {
            console.log('test settimeout');
        },1000);
    }

setTimeout 是延遲執行，它內部應該有一個隊列結構，也就是當咱們再1s內狂點100下按鈕時候，上面的函數雖然會1執行如下，但這100下都會執行完，這會涉及到一個問題

好比當咱們有一個小的圖片，鼠標放上去時候就再1s後浮動顯示出大圖片，當鼠標移開則消失，若是用setTimeout,的話，結果你懂的~

因此咱們須要把這1s內的多餘事件給丟棄， 因此引出了 throttle

                  /**
                   * 頻率控制 返回函數連續調用時，func 執行頻率限定爲 次 / wait
                   * 
                   * @param  {function}   func      傳入函數
                   * @param  {number}     wait      表示時間窗口的間隔
                   * @param  {object}     options   若是想忽略開始邊界上的調用，傳入{leading: false}。
                   *                                若是想忽略結尾邊界上的調用，傳入{trailing: false}
                   * @return {function}             返回客戶調用函數   
                   */
                  _.throttle = function(func, wait, options) {
                    var context, args, result;
                    var timeout = null;
                    // 上次執行時間點
                    var previous = 0;
                    if (!options) options = {};
                    // 延遲執行函數
                    var later = function() {
                      // 若設定了開始邊界不執行選項，上次執行時間始終爲0
                      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;
                      // 延遲時間間隔remaining小於等於0，表示上次執行至此所間隔時間已經超過一個時間窗口
                      // remaining大於時間窗口wait，表示客戶端系統時間被調整過
                      if (remaining <= 0 || remaining > wait) {
                        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;
                    };
                  };

這個函數咋用呢？以下

var s= 0;
var thth=   throttle(
        function (a) {
             s++;
             console.log(s);
             //return '測試結果';
        },
        1000,
        { leading:true, trailing:true}
);
document.querySelector('#throtol').onclick= function () {
    thth('測試參數');
};

 另外補充下 若是settimeout（）時間爲負數 則表示 當即執行 以下

    document.querySelector('#settimeout').onclick= function () {
        setTimeout(function () {
            console.log('test settimeout');
        },-1000);
    }

 再ps: 關於 if else  打印結果是什麼你知道嗎 

document.querySelector('#settimeout').onclick= function () {

    if(true){
        console.log(111);
    }else if(true){
        console.log(22);
    }else if(false){
        console.log(33);
    }else if(true){
        console.log(44);
    }
}

　打印的只有111……基礎知識啊………………