场景:
理论上onmousemove、vue 的watch变量、以及被其他端调用的方法,都有可能被频繁过度调用,从而瞬间产生过多方法调用,导致出现异常bug。
本人遇到挺多这种场景:
1、鼠标移动事件
2、websocket响应服务端的指令
都存在本地方法被瞬间过多调用的可能,这时候就需要用定时器做节流优化:
let _t = this; //this指向vue
let oTimeout = null;
if(!_t.changeWait){
_t.changeWait = true;
oTimeout = setTimeout(()=>{
//这边写你自己的业务方法
//_t.yourFunction();
_t.changeWait = false;
},50);
}else{
clearTimeout(oTimeout);
}
这时候,以上方法不管瞬间被调用多少次,yourFunction(),都只会50毫秒响应一次,达到节流作用