函数节流

断了今生、忘了曾经 提交于 2020-02-27 02:52:58

在某些高频度触发的事件中绑定操作需要用到节流函数

如在页面大小发生改变时

    window.addEventListener("resize",function () {
        console.log(1)
    })

这里并没有涉及到什么复杂的运算,如果我们需要监听页面大小变化执行复杂的运算时,浏览器可能会崩溃。

节流函数封装如下

    function throttle(fn,context) {
        clearTimeout(fn.tId)
        fn.tId = setTimeout(function () {
            fn.call(context)
        },1000)
    }

 

    window.addEventListener("resize",throttle(show))
    function show() {
        console.log(1)
    }
    function throttle(fn) {
        return function () {
            clearTimeout(fn.tId)
            fn.tId = setTimeout(fn,1000)
        }
    }
标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!