1.概念
防抖:
什么是防抖呢?就是用户触发事件过于频繁,只需要最后一次事件的操作。 可以把它想向成打游戏时候的回城,即一段时间内只触发一次,如果再次点击就会重新计时。
节流:
规定在一个单位时间内,只能触发一次函数。如果这个单位时间内触发多次函数,只有一次生效。
2.具体封装的方法
2.1 防抖函数
` const inp = document.querySelector("input");
//封装一个防抖函数
inp.oninput = debounce(function () {
console.log(this.value);
}, 500);
function debounce(fn, delay) {
let t = null;
return function () {
if (t !== null) {
clearInterval(t);
}
t = setTimeout(() => {
fn.call(this);
}, delay);
};
}`
2.2 节流函数
见综合demo