在回调中访问参数 (javascript)答案

【问题标题】：Accessing arguments within a callback (javascript)在回调中访问参数 (javascript)
【发布时间】：2022-01-22 09:41:14
【问题描述】：

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

这个函数稍后会有更多的功能，但现在，我只想让它返回一个函数，它将设置一个超时delay毫秒，然后使用参数调用原始函数（在本例中为e )。

我的问题在于debounce 函数中的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)
    }
  }

【问题讨论】：

标签： javascript node.js callback closures

【解决方案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 传递给您的去抖动函数。 ...args 是一个扩展运算符，表示take any number of arguments and store them inside the variable args。

【讨论】：