JS 防抖封装方法

防抖封装方法:

javascript 复制代码
/**
 * @param {Function} func
 * @param {number} wait
 * @param {boolean} immediate
 * @return {*}
 */
export function debounce(func, wait, immediate) {
  let timeout, args, context, timestamp, result

  const later = function () {
    // 据上一次触发时间间隔
    const last = +new Date() - timestamp

    // 上次被包装函数被调用时间间隔 last 小于设定时间间隔 wait
    if (last < wait && last > 0) {
      timeout = setTimeout(later, wait - last)
    } else {
      timeout = null
      // 如果设定为immediate===true,因为开始边界已经调用过了此处无需调用
      if (!immediate) {
        result = func.apply(context, args)
        if (!timeout) context = args = null
      }
    }
  }

  return function (...args) {
    context = this
    timestamp = +new Date()
    const callNow = immediate && !timeout
    // 如果延时不存在,重新设定延时
    if (!timeout) timeout = setTimeout(later, wait)
    if (callNow) {
      result = func.apply(context, args)
      context = args = null
    }

    return result
  }
}
相关推荐
报错小能手几秒前
ios开发方向——swift并发进阶核心 async/await 详解
开发语言·ios·swift
青花瓷6 分钟前
采用QT下MingW编译opencv4.8.1
开发语言·qt
忆琳6 分钟前
Vue3 全局自动大写转换:一个配置,全站生效
javascript·element
喵个咪9 分钟前
Headless 架构优势:内容与展示解耦,一套 API 打通全端生态
前端·后端·cms
小江的记录本13 分钟前
【JEECG Boot】 JEECG Boot——数据字典管理 系统性知识体系全解析
java·前端·spring boot·后端·spring·spring cloud·mybatis
赫瑞15 分钟前
Java中的日期类
java·开发语言
喵个咪16 分钟前
传统 CMS 太笨重?试试 Headless 架构的 GoWind,轻量又强大
前端·后端·cms
chenjingming66617 分钟前
jmeter导入浏览器上按F12抓的数据包
前端·chrome·jmeter
张元清17 分钟前
不用 Server Components 也能做 React 流式 SSR —— 实战指南
前端·javascript·面试