面试官：手写防抖和节流

函数防抖(debounce)

在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时

常用场景：百度搜索框、商品搜索

function debounce (fun, delay) {
    return function () {
        clearTimeout(fun.id)
        fun.id = setTimeout(() => {
            fun.call(this, arguments)
        }, delay)
    }
}

函数节流(throttle)

规定在一个单位时间内，只能触发一次函数。如果这个单位时间内触发多次函数，只有一次生效

常用场景：提交按钮避免同时多次触发

throttle (fn, delay = 0) {
    let last_time = 0
    return function () {
        // 函数当前执行的时间
        let now_time = new Date().getTime()
        // 若函数当前执行时间距离上次函数执行时间未大于delay，函数不执行
        if (now_time - last_time > delay) {
            fn.apply(this, arguments)
            // 更新函数最后一次执行时间
            last_time = now_time
        }
    }
}

如果严谨点，应该在每个函数上都做一个参数校验

if (!fn || typeof (fn) !== 'function') {
    fn = function (){}
    console.error('入参的函数为空或非函数')
}
if (!isNumber(delay)) {
    delay = 0
    console.error('入参的delay时间非整数')
}