1.函数的撙节

当延续触发事宜时，保证肯定时刻段内只挪用一次事宜处置惩罚函数。也就是一个函数实行一次后，只要大于设定的实行周期后才会实行第二次。

记忆法：联系到水流的流量，我想让你1s只流出若干水你就只能流若干水，多的水流只能比及下个周期才流出。

运用场景：如用户不停滑动滚轮，划定1s只能真正下滑一次，你滑再多也没用，只能比及下个周期你再滑才有效。

完成道理：
A：用函数的闭包来锁住上一实行的时刻，在用这一次实行的时刻比拟，大于设定的间隔时刻则实行
B：也能够直接把lasTime放到全局去，不必闭包但如许就不幸亏事宜监听的时刻通报参数delay只能写死

这里我撙节用闭包写，防抖就不必闭包了

用闭包就有一个题目，this的指向会非常复杂：
1.throttle函数的实行环境具有全局性，内部this通常是指向window的，然后返回一个匿名函数。
2.返回的匿名函数绑定了事宜，this指向监听的元素（document）
3.fn实在与上面返回匿名函数形成了闭包，且fn也实际上是一个匿名函数，匿名函数的实行具有全局性，fn内部this应当指向window
4这里用apply修改this指向，使fn内部的this从新指向document

<script type="text/javascript">
            function throttle(fn, delay) {
                console.log(this)//window
                // 纪录上一次函数触发的时刻
                var lastTime = 0;
                return function() {
                    // 纪录当前函数触发的时刻
                    var nowTime = Date.now();
                    if(nowTime - lastTime > delay) {
                     /*
                          fn();
                        console.log(this)//document
                    */
                        
                        fn.apply(this)// 修改this指向题目
                        console.log(this)//document
                        
                        // 同步时刻
                        lastTime = nowTime;
                    }
                }
            }
            document.onscroll = throttle(function() {
                /*console.log(this)//window*/
                console.log(this)//document
                console.log('scroll事宜被触发了' + Date.now())
            }, 1000)
        </script>

2.函数防抖

当延续触发事宜时，肯定时刻段内没有再触发事宜，事宜处置惩罚函数才会实行一次，假如设定的时刻到来之前，又一次触发了事宜，就从新开始延时，比方频仍触发的某一函数，防抖能够只让末了一次实行。记忆法:让函数实行者冷静下来后（不一向发抖后），才真正实行。

运用场景：用户屡次点击提交表单

不必闭包后构造会很简单

<script type="text/javascript">
            var timer = null;// 纪录上一次的延时器
            function debounce() {
                    console.log(timer)
                    clearTimeout(timer)
                    timer = setTimeout(function() {
                    console.log("aaa")
                    }, 1000)
            }
            document.getElementById('btn').onclick = debounce
        </script>