这篇防抖学不会，我回家养猪仔

工作场景

工作中有遇到么：产品要求输入内容后，去调接口查询结果，这要求有点扯，做个按钮点击去查询，它不香么 哈哈 产品要求，满足他，上--->防抖

代码思路

利用延时器，业务代码在延时器中，每次触发先清除以前的延时器，从新开始 看不懂思路，看demo

HTML

<!-- onkeyup 事件在用户释放键时 调用fn -->
<input type="text" onkeyup="fn()">

JavaScript

var timeId = null; // 定义延时器ID
function fn(params) {
    console.log('一直在输入了'); // 每次输入都会执行
    if (timeId) {// 有延时器时，就清除延时器
        clearInterval(timeId);
    }
    // 用户停止(最后一次)输入1秒后，执行console.log
    timeId = setTimeout(function(){ // document.getElementById("fname").value  Input输入内容
        console.log('最后一次输入完-->1秒后去调接口呀', document.getElementById("fname").value);
    },1000)
}

效果图

防抖总结

规定时间内，频繁触发的事件,只执行最后一次如上场景，频繁输入内容，真正调接口是在最后一次释放按键

场景总结

• 搜索框输入搜索
• 文本编辑器实时保存(VScode)

王者荣耀场景

防抖：类似于王者荣耀的游戏回城，一直点是没有用的，只执行最后一次。