节流防抖笔记
作者：互联网
# 1、 npm i --save lodash
# 2、对应的页面引入 import _ from 'lodash'
# 防抖：_.debounce 原理：原理是在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时。也就是说事件来了，先setTimeout定个时，n秒后再去触发回调函数。它和节流的不同在于如果某段时间内事件以间隔小于n秒的频率执行，那么这段时间回调只会触发一次。节流则是按照200ms或者300ms定时触发，而不仅仅是一次
应用场景：比如通过搜索过滤一个列表，通过“@change=“search”监听输入向后台发起请求，如果每输入一个字母就调用一次”search“向后台发送一次请求，效率将会很低，如果可以将调用search函数控制在一定时间内，比如1秒内，在这一秒钟，我输入了5个字母，search函数被调用了5次，但是只向后台发送一次请求，是不是效率就会提升很多，不需要频繁调接口。
例：searchBtn:_.debounce(function(){ let that=this console.log(1111111) },3000),
# 节流： _.throttle 原理 ：让一个函数不要执行得太频繁，减少一些过快的调用来节流。也就是在一段固定的时间内只触发一次回调函数，即便在这段时间内某个事件多次被触发也只触发回调一次。
# 注意 let that=this 重新定义指向
例： searchBtn:_.throttle(function(){ let that=this console.log(1111111) },10000),
官方文档 ：https://lodash.com/ 博文相关链接 ：https://segmentfault.com/a/1190000017227559
# 2、对应的页面引入 import _ from 'lodash'
# 防抖：_.debounce 原理：原理是在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时。也就是说事件来了，先setTimeout定个时，n秒后再去触发回调函数。它和节流的不同在于如果某段时间内事件以间隔小于n秒的频率执行，那么这段时间回调只会触发一次。节流则是按照200ms或者300ms定时触发，而不仅仅是一次
应用场景：比如通过搜索过滤一个列表，通过“@change=“search”监听输入向后台发起请求，如果每输入一个字母就调用一次”search“向后台发送一次请求，效率将会很低，如果可以将调用search函数控制在一定时间内，比如1秒内，在这一秒钟，我输入了5个字母，search函数被调用了5次，但是只向后台发送一次请求，是不是效率就会提升很多，不需要频繁调接口。
例：searchBtn:_.debounce(function(){ let that=this console.log(1111111) },3000),
# 节流： _.throttle 原理 ：让一个函数不要执行得太频繁，减少一些过快的调用来节流。也就是在一段固定的时间内只触发一次回调函数，即便在这段时间内某个事件多次被触发也只触发回调一次。
# 注意 let that=this 重新定义指向
例： searchBtn:_.throttle(function(){ let that=this console.log(1111111) },10000),
官方文档 ：https://lodash.com/ 博文相关链接 ：https://segmentfault.com/a/1190000017227559
标签：触发,防抖,节流,search,笔记,_.,let,lodash 来源： https://www.cnblogs.com/wangye123/p/15944854.html