所谓防抖，就是指触发事件后 n 秒后才执行函数，如果在 n 秒内又触发了事件，则会重新计算函数执行时间。 防抖类型分为 非立即执行版 立即执行版 合成版本 防抖
登录、发短信等按钮避免用户点击太快，以致于发送了多次请求 调整浏览器窗口大小时，resize 次数过于频繁，造成计算过多，此时需要一次到位 文本编辑器实时保存，当无任何更改操作一秒后进行保存
非立即执行版的意思是触发事件后函数不会立即执行，而是在 n 秒后执行，如果在 n 秒内又触发了事件，则会重新计算函数执行时间。
立即执行版的意思是触发事件后函数会立即执行，然后 n 秒内不触发事件才能继续执行函数的效果。
代码解析 当 执行 <code>debounce</code> 函数时， 第一次进来时，<code>timeout</code> 为false，所以 <code>callNow</code> 的值 为 <code>true</code> ,那么它会立即执行 <code>func</code> 函数，这时 <code>timeout</code> 的值 为 <code>true</code> , 当 <code>timeout 值为true 时</code>， 会执行 清空定时器，<code>此时 timeout 又为 false 了</code> , 这时 <code>callNow</code> 又 为 <code>true</code> ,再次执行 <code>func</code> 函数。 一直循环这样的操作： 当 <code>timeout</code> 为 <code>false</code> 时，会立刻执行 <code>func</code> 函数。 当 <code>timeout</code> 为 <code>true</code> 时，它会执行<code>clearTimeOut</code> ，这时<code>timeout</code> 又为 <code>false</code>, 而 <code>callNow</code> = <code>! timeout</code> , 就会立刻执行 <code>func</code> 函数了。
通过传递 <code>Boolean</code> 来决定执行哪种版本。 <code>true</code> 为立即执行版 <code>false</code> 为非立即执行版本 <code>debounce(func,1000,true)</code>
所谓节流，就是指连续触发事件但是在 n 秒中只执行一次函数。 节流会稀释函数的执行频率。 节流有两种实现： 时间戳版本 定时器版本
<code>scroll</code> 事件，每隔一秒计算一次位置信息等 浏览器播放事件，每个一秒计算一次进度信息等 <code>input</code> 输入框在搜索内容时，可以控制多少s 在执行请求，避免多次发起请求，节约性能。
当执行 <code>throttle</code> 函数时，<code>timeout</code> 默认为<code>undefined</code> , 此时，<code>! timeout</code> 为 <code>true</code> 时，执行 定时器，并且 将 <code>timeout</code> 为 null，即为<code>false</code>, 再次执行<code>throttle</code> 函数时，<code>!timeout</code> 又为 <code>true</code> ，再次执行定时器。 **通过 <code>timeout</code> 的状态来达到节流的控制 **
❤️关注+点赞+收藏+评论+转发❤️，原创不易，鼓励笔者创作更好的文章 关注公众号 前端自学社区，即可获取更多前端高质量文章！ 关注后回复关键词“加群”， 即可加入 “前端自学交流群”，共同学习进步。 关注后添加我微信拉你进技术交流群 欢迎关注公众号，更多精彩文章只在公众号推送
https://github.com/mqyqingfeng/Blog/issues/26