函数节流和函数防抖都是为了优化函数的执行效率和防止频繁触发函数而设计的。
函数节流指的是在一定时间间隔内，无论事件触发多少次，只执行一次函数。常用的实现方式是使用定时器和时间戳。
function throttle(func, delay) {
let timer = null;
let previous = 0;
return function() {
const now = Date.now();
const context = this;
const args = arguments;
if (now - previous > delay) {
clearTimeout(timer);
func.apply(context, args);
previous = now;
} else {
timer = setTimeout(function() {
func.apply(context, args);
previous = now;
}, delay - (now - previous));
}
}
}上述代码中，throttle 函数接收两个参数，func 表示要执行的函数，delay 表示时间间隔。当事件触发时，如果当前时间与上一次执行函数的时间间隔大于等于时间间隔 delay，则立即执行函数，并更新上一次执行函数的时间；如果时间间隔小于 delay，则设置一个定时器，在时间间隔到达后再执行函数。
函数防抖指的是在一定时间间隔内，多次触发事件只执行最后一次。常用的实现方式也是使用定时器。
function debounce(func, delay) {
let timer = null;
return function() {
const context = this;
const args = arguments;
clearTimeout(timer);
timer = setTimeout(function() {
func.apply(context, args);
}, delay);
}
}上述代码中，debounce 函数接收两个参数，func 表示要执行的函数，delay 表示时间间隔。当事件触发时，清除之前的定时器，并设置一个新的定时器，在时间间隔到达后执行函数。
需要注意的是，在使用函数节流和函数防抖时，要根据实际场景选择合适的时间间隔。如果时间间隔太短，可能会影响用户体验；如果时间间隔太长，可能会影响功能的实时性。