节流是频繁操作的时候保持一个频率触发。比如拖拽一个元素时,要随时拿到这个元素被拖拽的位置。
// 定时器版 function throttle(fn, delay = 100) { let flag = true; return function(...args) { if (!flag) return; flag = false; setTimeout(() => { fn.call(this, ...args); flag = true; }, delay); } } // 时间戳版 function throttle(fn, delay = 100) { let prev = 0; return function(...args) { const now = Date.now(); if (now - prev > delay) { fn.call(this, ...args); prev = now; } } } // 使用 div.addEventListener('drag', throttle(function(e) { console.log(e.offsetX, e.offsetY); }, 300));