防抖,就是在我们向后台访问数据时,一定时间之内值响应一次。使用场景如当我们在搜索框输入我们要搜索的值时,由于输入的数据比较长,如果我们每输入一个值,后台就要就要调用一次的话,而且并不是我们想要获取到的结果,我们想要的就是当我们输完之后的数据的搜索结果,这样会导致频繁的冗余的调用后台。为了避免这种情况,就可以运用防抖:
1 <input type="text" id="inp"> 2 <script> 3 var tar=document.getElementById("inp"); 4 tar.oninput=debounce(getdata,1000); 5 function getdata(){ 6 console.log(this.value); 7 } 8 function debounce(fn,wait){ 9 var timer=null; 10 return function(){ 11 var _this=this; 12 var argu=arguments; 13 clearTimeout(timer); 14 timer=setTimeout(function(){ 15 fn.call(_this,argu) 16 },wait); 17 } 18 } 19 20 </script>