防抖和节流是两种常用的解决JavaScript事件频繁触发的方法。在某些场景下，如input输入框的自动补全、页面的无限滚动等，频繁触发事件会导致性能问题，因此需要采用防抖和节流的方式来优化。
防抖的原理是在事件触发后等待一定时间再执行回调函数，如果在这段时间内再次触发事件，则重新计时，直到等待时间结束才会执行回调函数。这种方法常用于input输入框的自动补全和搜索，以减少请求次数。
function debounce(fn, delay) {
let timer = null;
return function() {
const context = this;
const args = arguments;
if (timer) {
clearTimeout(timer);
}
timer = setTimeout(() => {
fn.apply(context, args);
}, delay);
};
}
节流的原理是在一定时间内只执行一次回调函数，如果在这段时间内再次触发事件，则忽略该次事件。这种方法常用于页面的无限滚动和按钮的点击等，以减少回调函数的执行次数。
function throttle(fn, delay) {
let lastTime = 0;
return function() {
const context = this;
const args = arguments;
const nowTime = Date.now();
if (nowTime - lastTime > delay) {
lastTime = nowTime;
fn.apply(context, args);
}
};
}