新手Javascript：使用添加的括号调用函数时不运行（即使它不需要参数）

Question

这是我的功能，提醒我body标签的childNodes数量。

    function countBodyChildren() {
      var body_element = document.getElementsByTagName("body")[0];
      alert(body_element.childNodes.length);
}

 window.onload = countBodyChildren;

该函数运行正常，但是当我将add ()添加到函数名的末尾时，即window.onload = countBodyChildren(); 该功能无法运行。 为什么是这样？ 我想调用函数，即使它们不需要任何参数，你总是将()添加到它的名字的末尾。

Answer 1

我想调用函数，即使它们不需要任何参数，你总是将（）添加到它的名字的末尾。

你没想到。 但是在这里，你不想调用这个函数; 你想告诉浏览器什么时候来电话。

添加括号时，将立即调用该函数（不加载）。 该函数执行; 试图查找body元素，但尚未加载; 所以你body_element最终undefined为undefined 。 您在undefined查找childNodes ，并收到错误。 window.onload赋值不会发生。

即使你的函数没有抛出错误，它也会返回undefined ，因此window.onload变得undefined ，所以当最终加载页面时没有任何反应。

相反，你需要开始认为函数只是另一种价值。 当你说

function a() {
  // ...
}

它与此相同：

a = function() {
  // ...
};

（实际上存在差异，重要的是，但它们现在无关紧要;当你掌握了基础知识时，请查看它们）。 现在，函数“包含”在变量a 。 然后你可以这样做：

var b = a;
b();

它会工作 - 你把（你的函数）中a任何东西放入变量b ，然后通过调用它的新名称来执行它（因为现在a和b引用相同的函数）。 以同样的方式，之后

window.onload = countBodyChildren;

window对象的onload属性现在包含您的函数。 然后，浏览器将执行加载完成后的任何操作。

你有一个过早执行的情况。

Answer 2

window.onload期望的是对函数或函数定义的引用。

放置括号时，实际执行该函数，它是分配给window.onload的函数的返回值。

Answer 3

window.onload = countBodyChildren（）;

这就是说“调用函数，并将函数的返回值赋给window对象的onload属性。你的函数什么都不返回。

例如

function countBodyChildren() {
      var body_element = document.getElementsByTagName("body")[0];
      alert(body_element.childNodes.length);
return 5;
}
window.onload = countBodyChildren();

这将为onload道具分配5。 不是你想要的。 你需要为onload prop分配一个函数引用，所以js引擎可以在事件发生时调用该函数。