【金秋打卡】第11天 前端面试技能拼图2

课程名称：2周刷完100道前端优质面试真题
课程章节：第4章 前端面试技能拼图2 ：前端基础知识 ， 必知必会
主讲老师：双越

课程内容：

今天学习的内容包括：
4-5 -防抖和节流有什么区别，分别用于什么场景-防抖——注重结果，在抖动结束后处理。
4-6 -防抖和节流有什么区别，分别用于什么场景-节流——注重过程，在进行中进行处理。

课程收获：

节流和防抖

• 两者有什么区别
• 分别用于什么场景

防抖

• 防抖，防止抖动“你先抖动着，啥时候停了，再执行下一步”
• 例如，一个搜索输入框，等输入停止之后，再触发搜索

return function () {
      if (timer) clearTimeout(timer)

      timer = setTimeout(() => {
          fn.apply(this, arguments)
          timer = 0
      }, delay)
  }

节流

• 节流，节省交互沟通。流，不一定指流量。
• “别急，一个一个来，按时间节奏来，插队者无效”
• 例如，drag或scroll期间触发某个回调，要设置一个时间间隔

return function () {
    if (timer) return

    timer = setTimeout(() => {
        fn.apply(this, arguments)
        timer = 0
    }, delay)
}

答案

• 节流:限制执行频率，有节奏的执行
• 防抖︰限制执行次数，多次密集的触发只执行一次
• 节流关注“过程”，防抖关注“结果”

划重点

• 过程（限制频率) vs结果
• 实际工作可使用https://lodash.com

今天的 学习了 防抖和节流有什么区别，分别用于什么场景，节流和防抖都是减少请求，让程序更健壮，节流注重过程，防抖注重结果。

下一步就是 学习 px-%-em-rem-vw-vh有什么区别。今天学习就先到这里吧。

坚持打卡，坚持学习，未来可期，加油😀~

​​​​​​

​