js中的防抖、節流、點擊事件回調

　　以前，貼吧騙贊有個說法，快速點擊兩次可以贊兩下哦，這個情況倒是可以發生的，就是將點贊信息提交了多次。就算后端幫助判斷了不能點贊多次，將錯誤信息返回前台，頻繁提示“不能多次點贊”看起來也是很Low。我們可以根據需求來使用下面幾種方式讓效果、性能都能完美實現。

　　防抖的原理是在規定觸發時間內，多次點擊，都會重新刷新觸發時間，直到觸發時間完成回調才會觸發。防抖的運用場景大多在搜索關聯詞匹配、window窗口的變化已經滾動條的滾動。

　　節流的原理是在規定時間內不管點擊多少次都只會執行一次。而像我們提交信息的話，需要的是當后台返回信息后，我們做自己的邏輯判斷。節流的運用場景在瀑布流更新列表信息、當然短時間內不能重復提交、點擊事件也可以拿來使用。

　　防抖的核心實現代碼如下：

            //防抖
            function debounce(fun, delay = 200) {
                return function (args) {
                    //獲取函數的作用域和變量
                    let that = this
                    let _args = args
                    //每次事件被觸發，都會清除當前的timeer，然后重寫設置超時調用
                    clearTimeout(fun.id)
                    fun.id = setTimeout(function () {
                        fun.call(that, _args)
                    }, delay)
                }
            }

　　節流的核心實現代碼如下：

            //節流
            function throttle(fun, delay = 1000) {
                let last, deferTimer;
                return function (args) {
                    let that = this;
                    let _args = arguments;

                    let now = +new Date();
                    if (last && now < last + delay) {
                        clearTimeout(deferTimer);
                        deferTimer = setTimeout(function () {
                            last = now;
                            fun.apply(that, _args);
                        }, delay)
                    } else {
                        last = now;
                        fun.apply(that, _args);
                    }
                }
            }

　　而點擊期間不能再次點擊，我們可以設置一個全局變量，用戶點擊后變量切換狀態，該狀態不能再次點擊操作。