javascript - 有关使用函数并调用它们的简单问题

很基本的问题，但是由于不确定使用什么字词，所以我无法在任何地方找到合适的答案。我试图更好地了解此处发生的情况，以便避免再次犯此错误。如您在最后一行看到的那样，我正在尝试设置onclick事件，但它会立即调用该函数。解决的办法是删除括号，但这到底在做什么？两者有什么区别？谢谢你的帮助。

let element = document.querySelector("button");

function turnButtonRed (){
  element.style.backgroundColor = "red";
  element.style.color = "white";
  element.innerHTML = "Red Button";
}

element.onclick = turnButtonRed();

最佳答案

将turnButtonRed视为变量。

var turnButtonRed = function(){ return 2 };

现在，例如，如果您使用该变量将其传递给onclick，则有两种可能性

element.onclick = turnButtonRed; // this is setting onclick to a function
element.onclick = turnButtonRed(); // this is setting onclick to whatever the function returns (2 in this case).

您希望将onclick设置为函数，而不是函数的结果。 turnButtonRed()为您提供函数的结果，turnButtonRed为函数本身。