4. 实现节流函数throttle

题目链接

https://bigfrontend.dev/problem/implement-basic-throttle (opens new window)

题目说明

实现一个throttle(func, delay)，func是一个函数体，delay是延迟，返回的是一个受限制的函数

举例子：在节流之前，有一系列的调用，频率都不一样。
比如：
─A─B─C─ ─D─ ─ ─ ─ ─ ─ E─ ─F─G

在 3 次破折号的等待时间节流后：

─A─ ─ ─C─ ─ ─D ─ ─ ─ ─ E─ ─ ─G

题目解析

1. A被正常触发
2. 调用B被吞掉是因为B和C是在A的冷却时间内，所以C替换掉了B

/**
 * @param {(...args:any[]) => any} func
 * @param {number} wait
 * @returns {(...args:any[]) => any}
 */
function throttle(func, wait) {
  // 添加一个锁控制开关
  let flag = true
  let lastArgs
  return function(...args) {
    // 如果可以执行就执行，如果不可以执行就把参数替换掉
    if (flag) {
      flag = false
      func(...args)
      setTimeout(() => {
        // wait时间之后，如果有备用参数，就执行
        flag = true
        if (lastArgs) func(lastArgs)
      }, wait)
    } else {
      lastArgs = [...args]
    }
  }
}