什么是防抖：

为了防止用户短时间点击多次，就是用户疯狂的点击按钮导致的多次请求响应，会很影响性能

高级一点的程序员在写代码的时候会注重这些性能的优化，那什么是防抖呢

我们在前端代码里写一个button标签，并获取它的点击方法

var btn = document.querySelector('button') 这里获取到button标签
btn.onclick = function(){
    console.log("发起请求")
}

显然这这里是做不到防抖的效果的，我们的需求是防止用户短时间点击多次，只获取到最后一次

防抖的核心代码就是使用定时器清除器clearTimeout

var btn = document.querySelector('button') 这里获取到button标签
var timer = null
btn.onclick = function(){
clearTimeout(timer)
    timer = setTimeout(()=>{
        console.log("发起请求")
    },1000)
    
}

以上就是防抖和核心代码

节流

节流和防抖要达到的目的是一样的，防止多次的请求，节省流量消耗，优化代码。

节流并不是只执行一次，是在规定时间内执行一次，就拿开水闸的例子，早上八点到九点开放热水，过了这个时间没有热水，如果想再次接热水，必须等到第二天早上八点到九点间，这样就明白了吧

var btn = document.querySelector('button') 这里获取到button标签
var flag = true
btn.onclick = function () {
    if(flag){
        flag = fales;
        console.log("发送请求")
        setTimeout(()=>{
            flag = true
        },1000)
    }
}

节流的核心代码就是这样

防抖和节流本质上上都是优化代码提升性能，在面试中也会经常问到，打出来两者的区别就好