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);
                    }
                }
            }

　　而点击期间不能再次点击，我们可以设置一个全局变量，用户点击后变量切换状态，该状态不能再次点击操作。