一、背景在日常使用中，用户在进行搜索时，没输入一个字就会触发接口请求，这样就会造成网络请求繁忙；用户在下拉滚动调的时候，由于速度过快也会造成频繁触发接口调用。二、防抖防抖，顾名思义，防止抖动。用于将用户的操作行为触发转换为程序行为触发，防止用户操作的结果抖动。一段时间内，事件在我们规定的间隔n秒内多次执行，回调只会执行一次。 1/**2*防抖3*@param{function}fn4*@param{number}delay5*/6functiondebounce(fn,delay=500){7lettimer=null8returnfunction(){9if(timer){10clearTi

说到防抖和节流相信大家都不陌生，这两个东西大家可能多多少少都有用到过，最少也有听过古人云，温故而知新。虽然可能已经很熟悉防抖和节流了，但不妨再看一看巩固一下知识什么？你说你不仅不会手写防抖和节流，也没有听过。那也没事，下文会详细介绍的防抖和节流有什么用？简单来说，防抖和节流都是用来减少函数执行的频率，以达到优化项目性能或者实现特定功能的效果防抖定义：事件被触发一定时间后再执行回调。如果在这段时间内又被触发了，则重新开始计算时间常用场景输入框远程查询事件在线文档自动保存浏览器视口大小改变例子张三在某平台搜索一本书籍，发现搜索建议并不是瞬间就出现的，而是自己输入词组结束后出现的。那么该平台在此搜索

说到防抖和节流相信大家都不陌生，这两个东西大家可能多多少少都有用到过，最少也有听过古人云，温故而知新。虽然可能已经很熟悉防抖和节流了，但不妨再看一看巩固一下知识什么？你说你不仅不会手写防抖和节流，也没有听过。那也没事，下文会详细介绍的防抖和节流有什么用？简单来说，防抖和节流都是用来减少函数执行的频率，以达到优化项目性能或者实现特定功能的效果防抖定义：事件被触发一定时间后再执行回调。如果在这段时间内又被触发了，则重新开始计算时间常用场景输入框远程查询事件在线文档自动保存浏览器视口大小改变例子张三在某平台搜索一本书籍，发现搜索建议并不是瞬间就出现的，而是自己输入词组结束后出现的。那么该平台在此搜索

防抖和节流是处理高频触发最常见的优化方式，对性能提升有很大的帮助。防抖：将多次的高频操作优化为只在最后一次执行，应用场景如：输入框，只需在最后一次输入进行校验即可。节流：保证每隔一段时间只执行一次，降低触发的频率，将高频操作优化成低频操作。应用场景如：添加表单、滚动条事件、resize事件等高频监听事件。  防抖的代码：inputplaceholder="请输入手机号"/>script>//获取input对象letinp=document.querySelector('input');//监听input值的变化inp.addEventListener('input',antiShake(ani

防抖和节流是处理高频触发最常见的优化方式，对性能提升有很大的帮助。防抖：将多次的高频操作优化为只在最后一次执行，应用场景如：输入框，只需在最后一次输入进行校验即可。节流：保证每隔一段时间只执行一次，降低触发的频率，将高频操作优化成低频操作。应用场景如：添加表单、滚动条事件、resize事件等高频监听事件。  防抖的代码：inputplaceholder="请输入手机号"/>script>//获取input对象letinp=document.querySelector('input');//监听input值的变化inp.addEventListener('input',antiShake(ani