程序的防抖与节流
防抖：
程序防抖是为了使用户多次发起请求时，某时间内最终只请求最后一次，不影响用户的体验但实现监听请求功能。
例如 程序设置防抖时间为2秒 用户在第 0秒时请求第一次，在第2秒时本该执行方法，但方法还没执行
但是 用户在第 1秒时又请求了第二次，此时之前的请求清除，重新刷新定时器，方法在第3秒响应 依次类推
最经典的案例为：
1.当前我想要监听input输入框输入事件，我的预想是：用户每次输入后我都请求后台一次数据，当然是使用oninput监听输入动作
2.但是，如果用户输入的太频繁，会导致服务器压力过大
此时的解决方法是：
1.还是让用户请求，但是我只监听用户停下输入动作后的最后一次请求
实现方法：定时器+闭包
function debounce(fn, wait) {
//fn为需要防抖的方法,wait是等待时间
var timeout = null;
return function(a) {
/*如果有新的请求过来了，将清除上一次请求，达到每次只请求最新的那次的目的*/
//a为传入fn的参数
if(timeout !== null) clearTimeout(timeout);
timeout = setTimeout(()=>{fn(a)}, wait);
}
}
调用方法为
fn(a){console.log(a)}//需要被防抖的函数
let b=debounce(fn,1000) //b为新构造的函数 指向debounce内部return的function
b(‘需要传入fn的参数‘)
节流：
程序节流是为了在固定时间内只能请求一次
例如 设置节流的时间为 2秒 用户在第 0秒时请求第一次，程序立马执行，但是在0-2秒的所有请求失效
用户在第 1秒请求第二次，程序不执行
用户在第 3秒请求第三次，程序立马执行，但是在3-5秒时所有请求失效
案例：某页面跳转方法响应为0.2秒，但是用户在急的时候会疯狂点击，此时，我只能让他响应第一次
实现方法：定时器+闭包
function jieliu(fn,wait){
var state=true
//state表示是否可以请求通过
return function(a){
if(state){
//当可以通过时可以进行下面的操作
state=false //关门不让后续的过
fn(a) //执行函数
setTimeout(()=>{
state=true //开门
},wait)
}
}
}
调用方法为：
fn(a){ console.log(a)}//需要节流的函数
let bb=jieliu(fn,1000) //新构造的函数
bb(‘需要传入的参数‘)
原文：https://www.cnblogs.com/alecc1124/p/14767814.html