函数的节流和防抖

前言

我们在页面设计的时候，一个表单数据肯定有与之对应的监听事件，但是在用户频繁的输入或点击的情况下，如果没有相应的控制，就会频繁的触发函数去执行，这样导致代码的执行效率会变低。下面就用这两种方法来提高代码的执行效率。

防抖

对于用户的频繁触发不会执行，在触发结束n秒后执行一次。如果在n秒内再次被触发那么重新计时。

let timeout = null //防抖计时器

 setInput(event) {

    let search = event.detail.value.trim()
    console.log(search)
    this.setData({
      InputSearch: search
    })
    clearTimeout(timeout) //持续点击就会清除计时器
    timeout = setTimeout(() => {
      this.getPatchList()
    }, 1000)
  },

节流

高频的触发不会执行，只会按照设定的n秒内执行一次。

let isTrue = true //节流标识
 setInput(event) {
    let search = event.detail.value.trim()
    console.log(search)
    this.setData({
      InputSearch: search
    })
    //节流
    if(!isTrue){
      return
    }
    isTrue = false
    setTimeout(()=>{
      this.getPatchList()
      isTrue = true
    },1000)
  },

以上是个人的理解，如有错误还请大佬批评指正，欢迎各位大佬来探讨。