性能优化之throttle, debounce

throttle节流的思想：

应用场景：

主要Ӧ这种Ӧ用场景中

  const throttle = (func, limit) => {       let lastFunc       let lastRan       return function() {         const context = this         const args = arguments         if (!lastRan) {           func.apply(context, args)           lastRan = Date.now()         } else {           clearTimeout(lastFunc)           lastFunc = setTimeout(function() {             if ((Date.now() - lastRan) >= limit) {               func.apply(context, args)               lastRan = Date.now()             }           }, limit-(Date.now() - lastRa))         }       }     }   

debounce：防抖的思想：

     const  debounce  = (fn,delay)=>{         let timer ;         delay = delay || 200         return function(){           let ctx = this           let args = arguments           if(timer) clearTimeout(timer)           timer = setTimeout(()=>{              fn.apply(ctx,args)           },delay)         }       }

应用场景：

主要Ӧ用在类似百度首页的输入联想词请求中。如果每输入一个字就向后台发送请求，会造成请求的极大浪费。因为最终我们想要的结果是最后输入的字段所匹配出来的结果。

以下是测试地址：

Demo地址：

https://jsbin.com/wopojojiti/2/edit?html,console,output

文章来源: 性能优化之throttle, debounce