js节流与防抖

定义：

节流：固定时间段内只调用一次事件处理函数，如果在固定时间内多次触发，只生效一次

防抖：固定时间之后执行时间函数，如果固定时间内重复触发，定时器会重新计时

区别：

函数节流不管事件触发多少次，只在规定的时间内执行一次函数

函数防抖只执行最后一次触发的事件

如何实现

节流：

 <button>点击打印</button>
    <script>
        var but = document.querySelector('button')
        var kun = true
        but.onclick = function(){
                if(kun){
                    kun = false
                    console.log(222);

                    setTimeout(function(){
                        kun = true
                    },2000)
                }
        }
    </script>

防抖:

<button>点击打印</button>
    <script>
        var but = document.querySelector('button')
        var timer = null
        but.onclick = function(){
            clearTimeout(timer)
         timer = setTimeout(function(){
                console.log(222);
            },2000)
        }