对防抖和节流的理解

防抖（dobounce) 和节流（throttle）是前端常用的性能优化手段，用于控制函数执行的频率，从而达到减少计算资源的使用，提高用户体验。

防抖：指在一定的时间范围内，若函数被连续触发，则等待到设定的时间阀值只执行最后一次。

节流：指在一定的时间范围内，若函数被连续触发，只执行第一次或者固定时间范围内的几次。

防抖和节流的应用场景：防抖常用于搜索框输入时的搜索请求，防止用户输入过程中频繁发送请求，节流常用于鼠标不断点击触发的事件，如点击按钮发送请求，防止过快发送多次请求。

防抖代码：

function debounce(fn, wait) {
    let timeout = null;
    return function() {
        let context = this;
        let args = arguments;
        if (timeout) clearTimeout(timeout);
        let callNow = !timeout;
        timeout = setTimeout(() => {
            timeout = null;
        }, wait);
        if (callNow) fn.apply(context, args);
    };
}
 
// 使用
let myFunc = debounce(function() {
    console.log('防抖函数执行');
}, 1000);
window.addEventListener('scroll', myFunc);

节流代码：

function throttle(fn, wait) {
    let previous = 0;
    return function() {
        let context = this;
        let args = arguments;
        let now = new Date();
        if (now - previous > wait) {
            fn.apply(context, args);
            previous = now;
        }
    };
}
 
// 使用
let myFunc = throttle(function() {
    console.log('节流函数执行');
}, 1000);
window.addEventListener('scroll', myFunc);