js的防抖与节流

李先生打代码

于 2021-12-01 20:47:24 发布

阅读量65

点赞数

文章标签： echarts 前端 javascript

本文链接：https://blog.csdn.net/m0_59993469/article/details/121664308

版权

防抖节流事件处理性能优化异步操作

关键词由CSDN通过智能技术生成

防抖

防抖就是指频繁触发的情况下，只有足够的空闲时间，才执行代码一次

   var time = null
        document.getElementById('nothing').onscroll = function () {
            clearTimeout(time)
            time = setTimeout(() => {
                console.log(1);
            }, 300)
        }

我们可以这样当然里面的计时器可以换成网络请求等异步操作

节流

节流就是在一段时间内执行一次操作来触发一次

 var flag = true
        document.getElementById('throttle').onscroll = function () {
            if (flag) {
                flag = false
                setTimeout(() => {
                    flag = true
                    console.log(1);
                }, 1000)
            }
        }

可以这样来运用

防抖和节流可以根据自己的需求来调试