web前端高级JavaScript - 函数的防抖和节流

函数的防抖

函数的防抖：就是对于一些 频繁 的操作，在 一定的时间 内只 执行一次 （第一次或最后一次）。
场景描述：比如页面中的按钮点击事件，一般情况下会给按钮绑定一个点击事件，然后当我们点击按钮时就会触发事件并执行某些功能代码（比如请求后台api）。正常情况我们都是点击一下触发一次，但是不排除有人恶意不停的点击按钮，这样的话就会不停的去请求后台api，势必会给服务器造成一定的压力，所以为了防止这种频繁的操作，函数的防抖就诞生了。
实现思路：利用闭包机制

• 需要预先设定一个等待时间（等待这段时间内仅执行一次代码） wait，设置定时器用于计时
• 当我们第一次点击按钮触发事件时开始计时（这里需要一个定时器），等待wait这么长时间
• 在这等待期间看是否有第二次事件触发，如果没有第二次触发，则等待时间结束后自动执行功能代码
• 如果这等待期间第二次事件又被触发，则清除原来的定时器，重新开始计时重新等待wait这么长时间，并且代码不会执行直到在这段时间内不再频繁触发，代码才会执行。

使用场景：一般用于按钮点击事件

函数语法：
@params

• func[function]：要触发的函数，真正执行功能代码的函数
• wait[number]：等待时间
• immediate[boolean]：这里可以加个开关用于识别：是频繁操作的第一次执行还是最后一次执行

@return

• 可以被调用执行的函数

<button id="submit"></button>

//默认识别第一次，就是在该段时间内，只有第一次点击生效。
function debounce(func, wait = 300, immediate = true){
   
	let timer = null;
	return function anonymouse(..