很早之前就听到过这两个概念,今天也来研究一下它们的代码实现和概念
1 节流
在指定时间内函数只会触发一次。
代码实现
function throttle(fn, interval = 30000) { var isToRun = true; return function () { if (!isToRun) return; isToRun = false; setTimeout(() => { fn.apply(this, arguments) }, interval) } }
这里的fn就是我们需要节流的函数
2 防抖
任务频繁触发的情况下,只有任务触发的间隔超过指定间隔的时候,任务才会执行。
function debounce(fn, interval = 300) { let timeout = null; return function () { clearTimeout(timeout); timeout = setTimeout(() => { fn.apply(this, arguments); }, interval); }; }