浅谈防抖节流

                防抖和节流严格算起来应该属于性能优化的知识，但实际上遇到的频率相当高，处理不当或者放任不管就容易引起浏览器卡死。所以还是很有必要早点掌握的。刚入行业或者小项目用户量少的项目中可能不太会接触。但是你永远不会知道，在一个项目大的情况。下面的几句简简单单的代码会给服务器减轻多大的压力。甚至在活动项目中可以节省一个数十万预算的服务器。
                当一个项目只有部门的数百人或者数十人使用的时候，点击提交或者数据交互可能不太明显，但是像淘宝天猫甚至二线app的项目赶上双十一活动的时候，点击抢券或者购买的时候提交接口是每秒数以万计甚至百万的，那我们试想一下，如果因为着急秒单或者抢每个人都会疯狂点击，那如果没有防抖的话，服务器的压力就会数以十计的翻倍。可能百人的小项目数以十计不会崩，但是....ok废话不多说了哈直接开扒。（保证能看懂哈）

防抖 :  
           其实所谓的防抖就是利用定时器和闭包的原理。让一个方法在一定时间内之后才调用，并且，如果快速再次点击则会取消之前的点击事件，达到触发了多次但是只执行最后一次的目的。
               
我们先一步一步来
 首先我们先写一个我们要给他添加防抖的方法:

        function ask(){
                console.log("永劫无间yyds")
        }

 就是定时器呗
        setTimeout(ask,1000)
马老师：这样好吗？这样不好！我劝你耗子尾汁。

这样确实解决了让一个方法在一定时间内之后才调用的问题但是他并没有取消之前的点击，这样的话就根本没有起到减轻的作用。那并且后面的需求我们该如何处理呢？不说废话上代码。

function FD(sub, time) {

            let submits = null

            return function () {

                if (submits) {

                    clearTimeout(submits)

                }

                submits = setTimeout(sub, time)

            }

        }

        var test = FD(ask, 3000)
        此时会发现，不论你3秒内调用了多少次ask他只调用了一次。思路很简单，首先我们要利用定时器是肯定的，那我们只要在点击的时候取消上一个还没有执行的定时器即可停止被停止定时器中的方法，而利用闭包的不回收机制，可以多次调用下依然保留submits 的值。
        好了那就这样，节流的话下一篇再说。       


如果内容有错误的地方欢迎指出（觉得看着不理解不舒服想吐槽也完全没问题）；如果有帮助，欢迎点赞和收藏。感谢观看