1. 程式人生 > 實用技巧 >防抖函式

防抖函式

 1 /**
 2  * 防抖函式
 3  * @param {*} func 防抖後要執行的回撥
 4  * @param {*} wait 等待時間
 5  * @param {*} immediate 
 6  */
 7 function debounce(func, wait, immediate) {
 8   let timeout, args, context, timestamp, result;
 9 
10   const later = function () {
11     // 距上一次觸發時間間隔
12     const last = +new Date() - timestamp;
13 14 // 上次被包裝函式被呼叫時間間隔last小於設定時間間隔wait 15 if (last < wait && last > 0) { 16 timeout = setTimeout(later, wait - last); 17 } else { 18 timeout = null; 19 // 如果設定為immediate===true,因為開始邊界已經呼叫過了此處無需呼叫 20 if (!immediate) { 21 result = func.apply(context, args);
22 if (!timeout) context = args = null; 23 } 24 } 25 }; 26 27 return function (...args) { 28 context = this; 29 timestamp = +new Date(); 30 const callNow = immediate && !timeout; 31 // 如果延時不存在,重新設定延時 32 if (!timeout) timeout = setTimeout(later, wait);
33 if (callNow) { 34 result = func.apply(context, args); 35 context = args = null; 36 } 37 38 return result; 39 }; 40 }