JavaScript 防抖和节流

Posted 2021-06-08 全栈大咖

防抖和节流

防抖

 准备工作 获取id值再改id上添加监听点击事件

难点一 要在一个函数调用另外的一个函数return 里面

第二clearTimeout 和setTimeout 由于要清除时间所以定义变量的时候要将变量写在return上面，

第三在里面写如apply将return里面的函数的this和arguments传递到外面，这样函数的submit就和fn()对应起来

第四难点submit的this指向的是 input而setTimeout的this指向的是window是由于回调函数的缘故所以要在调用setTimeout前保持this然后apply到submit上

<input type="submit" id="input" value="提交" />
 

var btn = document.getElementById("input");
        btn.addEventListener(\'click\', fn(submit) )
        function submit(){
            console.log(1)
            console.log(this)
        }
        function fn(){
            var t = null
            return function(){
                    let context = this
                if(t){
                    clearTimeout(t)
                }
                t =  setTimeout(function(){
                    submit.apply(context, arguments)
                },1000)
            }
        }

 

 待补充