防抖和节流都是为了减少某些操作的频率，提高系统性能和用户体验。它们的作用相似，但其实现原理不同。
防抖（Debounce）指在一定时间内连续触发同一事件时，只执行最后一次操作。比如，在输入框中连续输入字符时，可以设置一个防抖函数，当用户停止输入后才会触发搜索操作，这样可以避免多次请求，提升搜索效率。防抖适用于那些需要等待一段时间再执行的操作。
节流（Throttle）指在一定时间间隔内只执行一次操作。比如，在滚动页面时，可以设置一个节流函数，每隔一定时间才执行一次页面渲染操作，这样可以避免频繁的渲染操作，提升页面性能。节流适用于那些需要周期性执行的操作。
因此，防抖和节流的区别在于它们对应的操作类型不同：防抖用于等待一段时间后执行的操作，节流用于周期性执行的操作。
节流在间隔一段时间执行一次回调的场景有：滚动加载，加载更多或滚到底部监听，搜索框，搜索联想功能；
防抖在连续的事件，只需触发一次回调的场景有:搜索框搜索输入。只需用户最后一次输入完，再发送请求， 手机号、邮箱验证输入检测，窗口大小 resize 。只需窗口调整完成后，计算窗口大小。防止重复渲染。
` // 防抖函数
/**
- @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
} }
// 节流函数
export function throttle(func, wait) {
let timeout;
return function () {
if (!timeout) {
timeout = setTimeout(() => {
timeout = null;
func.apply(this, arguments);
}, wait);
}
};
} `
对于“防抖函数debounce”其使用方法： 先进行引入：import { debounce } from "@/utils"; //防抖
这是在具体位置的使用
useThrottle: debounce( function () { this.addMembers(); }, 1000, false ),
只需要将三个参数传入即可
节流函数同理
