防抖和节流

防抖

一般用于input输入事件，频繁触发的事件或者行为。需要只执行最后一次（核心）

<button class="btn">注册</button>
<script>
        var input = document.querySelector('input')
input.oninput = (function () {
             let timer = null
            return function () {
                 clearInterval(timer)
                 timer = setTimeout(()=>{
                 //触发的事件
                     console.log('我要发送请求了')
                 },500)
            }
        })()
    </script>

节流

控制执行的次数,主要用在移动端的点击 ,一般用在移动端会偏多

var btn = document.querySelector('.btn')
btn.onclick = (function (delay) {
            let flag = true
            return function () {
                if (flag) {
                    // 通过以后 马上把开关的状态设置为false
                    flag = false
                    btn.disabled = true
                    console.log('我要发送请求了')
                    setTimeout(() => {
                        btn.disabled = false
                        flag = true
                    }, delay)
                }
            }
        })(4000)