在回调中访问 arguments (javascript)

Question

我正在尝试编写“去抖动”function，但我被困在代码的一部分中。 在下面的代码中，我将回调传递给addEventListener并将其包装在debounce function 中。

这个 function 稍后将具有更多功能，但现在，我只希望它返回一个 function，它将设置delay毫秒的超时，然后使用参数调用原始e

我的问题出在debounce function 中，上面写着callback("original-args") 。 我想用传递给回调的实际参数替换“original-args”。 我如何获得该论点？

  button.addEventListener("click", debounce(e => {
    let elem = document.createElement("P"); 
    elem.textContent = "Clicked";
    container.appendChild(elem);
  }, 2000))

  function debounce(callback, delay) {
    return function() {
      setTimeout(() => {
        callback("original-args")
      }, delay)
    }
  }

Answer 1

您可以执行以下操作：

button.addEventListener(
  "click",
  debounce(
    (e) => {
      let elem = document.createElement("P");
      elem.textContent = "Clicked";
      container.appendChild(elem);
    },
    2000
  )
);

function debounce(callback, delay) {
  return function (...args) {
    setTimeout(() => {
      callback(...args);
    }, delay);
  };
}

因此，您可以将...args传递给您的去抖动 function。 ...args是一个扩展运算符，这意味着take any number of arguments and store them inside the variable args中。