javascript - 事件处理程序仅在将事件作为参数传递时才起作用 - 为什么？

Question

我想构建一个函数来切换/取消切换列表的所有项目（populateList()是一个单独的函数来编写实际的 html）：

function toggleAll(event, check) {
  items.forEach(item => {
    if (check === "check") {
      item.done = true;
    } else {
      item.done = false;
    }
  });
  localStorage.setItem("items", JSON.stringify(items));
  populateList(items, itemsList);
}

单击相应的按钮 ( checkAll/ uncheckAll) 时，应触发该功能：

const checkAll = document.querySelector(".check");
const uncheckAll = document.querySelector(".uncheck");

checkAll.addEventListener("click", toggleAll("check"));
uncheckAll.addEventListener("click", toggleAll("uncheck"));

显然这不起作用。由于某些原因，该功能toggleAll仅在页面加载时运行一次，按钮没有反应。我尝试使用以下代码传递事件本身：

checkAll.addEventListener("click", (event) => toggleAll(event, "check"));
uncheckAll.addEventListener("click", (event) => toggleAll(event, "uncheck"));

这工作得很好！我不知道为什么。有人可以请教我吗？我在这里俯瞰什么？

标签： javascriptlistfunctionevent-handlingdom-events