js中的防抖

简介: 在开发中经常会有这样的需求,需要用到防抖方法

/**

  • 防抖
  • 在一定时间间隔内,多次调用一个方法,只会执行一次.
  • @param {*} func 要进行debouce的函数
  • @param {*} wait 等待时间,默认500ms
  • @param {*} immediate 是否立即执行

*/

export function debounce(func, wait=500, immediate=false) {
    var timeout
    return function() {
        var context = this
        var args = arguments

        if (timeout) clearTimeout(timeout)
        if (immediate) {
            // 如果已经执行过,不再执行
            var callNow = !timeout
            timeout = setTimeout(function() {
                timeout = null
            }, wait)
            if (callNow) func.apply(context, args)
        } else {
            timeout = setTimeout(function() {
                func.apply(context, args)
            }, wait)
        }
    }
}

在开发中经常会有这样的需求,需要用到防抖方法

相关文章
|
6天前
|
JavaScript
JS中防抖和节流的区别是什么
JS中防抖和节流的区别是什么
24 0
|
6天前
|
JavaScript 前端开发 UED
【面试题】面试官:说说你对js中的 防抖 和 节流 的理解
【面试题】面试官:说说你对js中的 防抖 和 节流 的理解
|
6天前
|
JavaScript 前端开发 UED
js的防抖节流
js的防抖节流
11 1
|
6天前
|
测试技术
js_防抖与节流(闭包的使用)
js_防抖与节流(闭包的使用)
18 0
|
6天前
|
JavaScript
|
6天前
|
前端开发 JavaScript UED
【JavaScript】面试手撕防抖
防抖: 首先它是常见的性能优化技术,主要用于处理频繁触发的浏览器事件,如窗口大小变化、滚动事件、输入框内容改变等。在用户连续快速地触发同一事件时,防抖机制会确保相关回调函数在一个时间间隔内只会被执行一次。
41 0
|
6天前
|
JavaScript 前端开发
js的节流和防抖
js的节流和防抖
19 0
|
6天前
|
JavaScript 前端开发 UED
|
6天前
|
JavaScript 前端开发 UED
JavaScript:节流&防抖
JavaScript:节流&防抖
31 1
|
6天前
|
JavaScript 前端开发 搜索推荐
面试官:请说说JS中的防抖和节流
面试官:请说说JS中的防抖和节流