防抖&&节流

防抖

        function debounce(fn, time) {
            let timer = null
            
            return function () {
                clearTimeout(timer)
                
                timer = setTimeout(() => {
                    fn.apply(this, arguments)
                }, time)
            }
        }

节流

        function throttle(fn, time) {
            let isRun = true
            
            return function () {
                if (!isRun) return
                
                isRun = false
                
                setTimeout(() => {
                    fn.apply(this, arguments)
                    isRun = true
                }, time)
            }
        }
  window.addEventListener('scroll', debounce(log, 1000))
  window.addEventListener('scroll', throttle(log, 1000))

总结

防抖:在规定时间内,使连续触发事件失效,只在规定时间结束后才执行该事件。但是,在延迟时间内触发该事            件又会重置该延迟时间,所以只执行最后一次
节流:如果一直触发某一事件,在规定时间内只触发一次该事件回调函数。与防抖不同的是,在延迟时间内触
           发该事件,延迟时间不会重置

你可能感兴趣的:(JavaScript,前端面试,javascript,开发语言,ecmascript)