美文网首页
JS节流、防抖

JS节流、防抖

作者: 取个帅气的名字真好 | 来源:发表于2022-07-20 14:40 被阅读0次

    节流就是「技能冷却中」

    const 闪现 = ()=>{
      console.log('闪现');
    }
    
    
    const throttle = (fn, time) =>{
      let 冷却中 = false
    
      return (...args)=>{
        if(冷却中){
          return
        }
        fn(...args)
        冷却中 = true
    
        setTimeout(()=>{
          冷却中 = false
        }, time)
      }
    }
    
    // 优化
    const throttle2 = (fn, time) =>{
      let timer = null
    
      return (...args)=>{
        if(timer){
          return
        }
        fn(...args)
    
        timer = setTimeout(()=>{
          timer = null
        }, time)
      }
    }
    
    
    
    const xx = throttle(闪现, 10 * 1000)
    

    防抖就是「回城被打断」

    const debounce = (fn, time) => {
      let 回城计时器 = null
      return (...args) => {
        if (回城计时器 !== null) {
          clearTimeout(回城计时器) // 打断回城
        }
        // 重新回城
        回城计时器 = setTimeout(() => {
          fn.call(undefined, ...args) // 回城后调用 fn
          回城计时器 = null
        }, time)
      }
    }
    

    相关文章

      网友评论

          本文标题:JS节流、防抖

          本文链接:https://www.haomeiwen.com/subject/ndccirtx.html