简单实现函数防抖、函数节流

节流概念： 限制函数触发频率，规定时间内只能触发一次。

代码实现:

function Throttle(fun,t) {
        let timeout
        return function () {
            if(!timeout){
                timeout = setTimeout(()=>{
                    timeout=null
             },t)
             fun(arguments)
         }
     }
}

document.getElementById('element').onclick=Throttle(()=>{
    console.log(1)
},1000)

防抖概念： 连续触发事件，只触发一次，只有中断指定的时间后，才能再次触发。

代码实现:

function Shake(fun,t) {
        let timeout
        return function () {
            if(!timeout){
                timeout = setTimeout(()=>{
                    timeout=null
                },t)
                fun(arguments)
            }else{
                clearTimeout(timeout)
                timeout = setTimeout(()=>{
                    timeout=null
            },t)
        }
    }
}

总结： 防抖与节流大体上差不多，只是一点点细节差别。 都运用了函数柯里化思想，闭包一个计时器，若每次调用函数时，定时器存在就做相应处理，达到实现防抖与节流。（以上只是实现最基本的节流与防抖，其他未考虑。如：参数的传递）