js防抖和节流

    <input placeholder="请输入">

    const inputText = document.querySelector('input')    
    inputText.addEventListener('input', function() {     
         console.log('发送请求');    }）

如一个input元素，按下键盘后，就会触发事件，不断输出log。

进行防抖优化：

   inputText.addEventListener('input', antiShake(demo, 1000))    
    // 防抖函数       
   function antiShake(fn, wait) {      
        let timeout = null      
        return args => {        
            if (timeout) clearTimeout(timeout)        
            timeout = setTimeout(fn, wait)      
        }    
    }    
    function demo() {      console.log('发送请求');    }

在输入停止一秒后，才触发。

而节流，保证一点时间内只调用一次函数，如表单的提交，高频监听事件。

 box.addEventListener('touchmove', antiShake(demo, 2000))
 function throttle(evnet, time) {      
    let timeout = null      
    return () => {       
        if (!timeout) {          
            timeout = setTimeout(() => {            
                evnet()            
                timeout = null          
            }, time)        
        }      
    }    
 }
    function demo() {      console.log('发送请求');    }