- 背景：如监听窗口大小的改变、滚动，因为我们稍微改变一下窗口大小、鼠标滚轮稍微滚动一下，就可以调用几十次函数，事件在队列里排队等待执行，而js是单线程的，这样会阻碍其他事件的执行、造成卡顿、假死、用户体验差等问题，这就需要用到throttle、debounce来减少函数的执行次数
- 节流，减少事件的执行次数,
// 简易版const throttle = (func, limit) => { let inThrottle return function() { const args = arguments const context = this if (!inThrottle) { func.apply(context, args) inThrottle = true setTimeout(() => inThrottle = false, limit) } }}// 可以获得最后一次的执行const throttle = (func, limit) => { let lastFunc let lastRan return function() { const context = this const args = arguments if (!lastRan) { func.apply(context, args) lastRan = Date.now() } else { clearTimeout(lastFunc) lastFunc = setTimeout(function() { if ((Date.now() - lastRan) >= limit) { func.apply(context, args) lastRan = Date.now() } }, limit - (Date.now() - lastRan)) } }}复制代码 2.函数防抖
const debounce = (func, delay) => { let inDebounce return function() { const context = this const args = arguments clearTimeout(inDebounce) inDebounce = setTimeout(() => func.apply(context, args), delay) }}复制代码