节流

// 节流就是 - 技能冷却中
const throttle = (fn, time) => {
    let 冷却中 = false
    return (...args) => {
        if(冷却中) return
        fn.call(undefined, ..args)
        冷却中 = true
        setTimeout(() => {
            冷却中 = false
        }, time)
    }
}
// 还有一个版本是在冷却结束时调用 fn
// 简洁版，删掉冷却中变量，直接使用 timer 代替
const throttle = (f, time) => {
    let timer = null
    return (...args) => {
        if (timer) return
        f.call(undefined, ...args)
        timer = setTimeout(() => {
            time = null
        }, time)
    }
}

使用方法

const f = throttle(() => {
    console.log('hi')
}, 3000)
f() // 打印 hi
f() // 技能冷却中

防抖

防抖：
// 防抖就是 - 回城被打断
const debounce = (fn, time) => {
    let 回城计时器 = null
    return (...args) => {
        if (回城计时器 !== null) {
            clearTimeout(回城计时器) // 打断回城
        }
        // 重新回城
        回城计时器 = setTimeout(() = > {
            fn.call(undefined, ...args)
            回城计时器 = null
        }, time)
    }
}

使用方法

const tp = debounce(() => {
	console.log('回城成功')
}, 3000)