防抖节流-我的理解

38 阅读1分钟

 核心区别

1. 防抖(Debounce)

  • 延迟执行操作,直到用户停止触发事件后一段时间(例如停止点击后 5s)。如果用户连续快速点击,操作可能永远不会执行。

  • 我的理解

        //2岁儿子喊爸爸
        //场景1
        儿子:爸爸
        爸爸:哎
        
        //场景2
        儿子:爸爸,爸爸,
        爸爸:哎,哎,
        
        // 场景3
        儿子:爸爸,爸爸,爸爸,
        爸爸:哎,哎,哎,
        
        ...
        // 4 个小时之后场景
        儿子:爸爸,爸爸,爸爸 ... 
        
        //儿子停顿 5s后
        爸爸:哎。
        
        这个场景就是防抖。
        ps:儿子喊爸爸,就是点击,连续点击。连续点击结束后,5s后再响应(爸爸回应:哎)。
    
    

2. 节流(Throttle)

  • 节流

  • 在固定时间间隔内只执行一次操作。例如,设置 1 秒的节流,无论用户点击多少次按钮,1 秒内只会触发一次抽奖。

  • 我的理解

    儿子可以一直喊“爸爸”,但爸爸 每 5 秒最多回应一次,不管儿子喊得多频繁。