封装防抖节流，控制函数调用————JS

最新推荐文章于 2024-02-26 16:03:19 发布

⎛⎝陈嗯嗯⎠⎞

最新推荐文章于 2024-02-26 16:03:19 发布

阅读量232

点赞数

分类专栏：前端 JS 文章标签： js 封装

本文链接：https://blog.csdn.net/weixin_41018304/article/details/115999870

版权

前端同时被 2 个专栏收录

53 篇文章 0 订阅

订阅专栏

12 篇文章 0 订阅

订阅专栏

超级方便！！！！！封装在common.js文件需要时调用！

  /**
   * 函数防抖
   */
  function debounce(fn, wait = 1000) {
    let timer;
    return function () {
      let context = this;
      let args = arguments;
      if (timer) clearTimeout(timer);
      timer = setTimeout(() => {
        fn.apply(context, args);
      }, wait)
    }
  }
  /**
   * 函数节流
   */
  function throttle(fn, wait = 1000) {
    let timer;
    return function () {
      if (timer != null) return;
      let context = this;
      let args = arguments;
      fn.apply(context, args);
      timer = setTimeout(() => {
        timer = null;
      }, wait);
    }
  }

使用方法：

    btnDebounce: debounce(function (str1, str2) {
        console.log(str1, str2);
    }, 2000),    
    btnDethrottle: throttle(function (str1, str2) {
        console.log(str1, str2);
    }, 2000),