前端必会的“防抖”和“节流”方法

最近因为疫情隔离居家办公，闲着没事也在回忆和整合学过的知识，这里给大家分享几个有关“防抖”和“节流”方法，希望对大家有所帮助

公司主营业务：成都做网站、成都网站建设、移动网站开发等业务。帮助企业客户真正实现互联网宣传，提高企业的竞争能力。创新互联公司是一支青春激扬、勤奋敬业、活力青春激扬、勤奋敬业、活力澎湃、和谐高效的团队。公司秉承以“开放、自由、严谨、自律”为核心的企业文化，感谢他们对我们的高要求，感谢他们从不同领域给我们带来的挑战，让我们激情的团队有机会用头脑与智慧不断的给客户带来惊喜。创新互联公司推出都昌免费做网站回馈大家。

1 前言

在前端开发过程中，会遇到很多实时输入查询、滚动条触发等业务。而这些频发操作的事件，如果每次触发都进行执行的话，会造成性能下降、后台的压力变大，那么此时就需要使用防抖和节流进行处理。

防抖和节流，见名思义：防抖是防止抖动，节流是节约流量。

2 防抖

防抖（Debounce） 指的是触发事件后n秒后才能执行函数，如果在n秒内触发了事件，则会重新计算执行时间。

常见场景：点击按钮、拍照、下拉触底加载下一页等。

持续触发输入事件时，并不会立即执行func函数，而是在指定时间delay中没有再次触发事件时，才会进行延时执行func函数。

2.1 原始栗子（未进行防抖处理）

为了更加深入透彻地理解为什么要进行防抖处理，我们可以先体验不进行防抖的输入函数触发ajax实时请求的情况。