防抖和节流

防抖函数debounce(func,wait)：当事件在n秒内被连续触发，只执行最后一次

应用：搜索框搜索输入，文本编辑器实时保存

// 第一个参数是需要进行防抖处理的函数，第二个参数是延迟时间，默认为1秒钟
function debounce(fn, delay = 1000) {
// 实现防抖函数的核心是使用setTimeout
    // time变量用于保存setTimeout返回的Id
    
    let time = null
    
    // 将回调接收的参数保存到args数组中
    function _debounce(...args) {
        // 如果time不为0，也就是说有定时器存在，将该定时器清除
        if (time !== null) {
            clearTimeout(time)
        }
        
        time = setTimeout(() => {
            // 使用apply改变fn的this，同时将参数传递给fn
            fn.apply(this, args)  
        }, delay)
    }
    
    // 防抖函数会返回另一个函数，该函数才是真正被调用的函数
    return _debounce
}

节流函数throttle(func,wait)：当事件被连续触发时，每隔n秒执行一次

// interval 间隔时间，也就是cd的长短
function throttle(fn, interval) {
    //该变量用于记录上一次函数的执行事件
    let lastTime = 0
    
    const _throttle = function(...args) {
        // 获取当前时间
        const nowTime = new Date().getTime()
        
        // cd剩余时间
        const remainTime = nowTime - lastTime
        // 如果剩余时间大于间隔时间，也就是说可以再次执行函数
        if (remainTime - interval >= 0) {
            fn.apply(this, args)
            // 将上一次函数执行的时间设置为nowTime，这样下次才能重新进入cd
            lastTime = nowTime
        }
    }
    // 返回_throttle函数
    return _throttle
}