防抖和节流有什么区别？

防抖：在重复触发这个事件后，在一定时间内没有触发，事件处理方法会执行一次，如果在这个时间内又触发了，那么就会重新计时。

节流：无论你触发多少次事件，每隔一段时间就会执行一次事件处理方法

他俩的区别：防抖只会执行一次事件处理函数，节流是无论触发多少次，每隔一段时间就会执行一次事件处理函数

防抖：

<template>
  <div>
    <button @click="getClick()"></button>
  </div>
</template>
<script>
export default {
  data() {
    return {}
  },
  methods: {
    getClick() {
      let timer = null
      return function () {
        if (timer) clearTimeout(timer)
        timer = setTimeout(() => {
          console.log('click')
        }, 200)
      }
    }
  }
}
</script>

节流：

<template>
  <div>
    <button @click="getClick()"></button>
  </div>
</template>
<script>
export default {
  data() {
    return {
      // 定义一个节流阀
      flag: false
    }
  },
  methods: {
    getClick() {
      if (!this.flag) {
        this.flag = true
        setTimeout(() => {
          this.flag = false
          console.log('按钮点击')
        }, 200)
      }
    }
  }
}
</script>

有错误的话 请大家批评指正