WHAT 什么是防抖？
当持续触发相同事件时，如果设定的时间到来之前，又一次触发了事件，就重新开始延时；如果设定的时间到来之后都没有再次触发事件，则执行最后一次事件。（就像王者荣耀的回城操作一样）
HOW 应用场景
1. keyup事件（example：输入框 [验证用户名是否可用]）
普通版的输入框事件：
用户每按一下键盘都会发送一个ajax请求出去，用户还没输入完成，就发送了很多无用的请求，浪费性能。
<body>
<input id="user" type="text" placeholder="请输入要验证的名字" />
<script>
$("#user").keyup(() => {
const userName = $("#user").val().trim();
console.log(userName);
$.ajax({
method: "get",
url: "http://127.0.0.1:3001/validate",
data: { userName },
success: (res) => {
console.log(res);
},
});
});
</script>
</body>
console：
2. 防抖版的输入框事件
<script>
$(function () {
// timer 用于存储定时器 id
let timer = null;
$("#user").keyup(() => {
// 关闭之前的定时器
clearTimeout(timer);
// 执行新的定时器，如果 500 毫秒内没有新的操作，才发送网络请求
timer = setTimeout(function () {
const userName = $("#user").val().trim();
console.log(userName);
$.ajax({
method: "get",
url: "http://127.0.0.1:3001/validate",
data: { userName },
success: (res) => {
console.log(res);
},
});
// 定时器的时间
}, 500);
});
});
</script>
console：
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
