38

我有以下功能 

function hello() {
 alert("hi!");
}

拿这段代码：

var elem = document.getElementById("btn");
elem.onclick = hello;

我的问题可能有点难以理解，所以请耐心等待：这段代码与普通调用的区别是什么，或者是什么让这段代码需要对函数变量的引用而不是常规调用？( hello();)

我怎么知道我应该在哪里引用该函数，以及何时应该实际调用它？

4

6 回答 6

45

好吧，该onclick属性需要一个对函数的引用，以便在单击元素时执行它。通常它是：

element.onclick = funcRef;

或者

element.onclick = function () {
    funcRef();
};

（当然，最好使用addEventListenerand attachEvent）

注意它们都是对函数的引用，而不是调用。

当某些东西需要引用时，您不会调用它...您为其分配引用（第一个示例）。

当您想专门调用一个函数时，您可以使用()（第二个示例）调用它。但是请注意，在第二个示例中，仍然存在对分配给函数的引用onclick——它只是一个匿名函数。

可能更重要的部分：

有些人认为你想这样做：

element.onclick = funcRef();

但这会立即执行函数（因为()），并将其返回值分配给onclick. 除非返回值是一个函数，否则这不是你想要的。

我认为这个故事的寓意是，当您现在想要/需要执行某些操作时，您可以调用该函数。如果需要该函数以供以后使用或需要存储，则不要调用它。

于 2013-04-08T18:29:51.383 回答
28

你想让它现在执行吗？然后调用它。

a=hello()表示“尽快调用hello()，并将其返回值设置为a”。

另一方面，a=hello表示“a是 的别名hello。如果你调用a()，你会得到与调用相同的结果hello()”

您将后者用于回调等，您想告诉浏览器在事件发生后您想要发生什么。例如，您可能想说“hello()用户点击时调用”（如示例中所示）。或者，“当 AJAX 查询返回结果时，callback()对返回的数据调用函数”。

于 2013-04-08T18:31:31.380 回答
18

我怎么知道我应该在哪里引用该函数，以及何时应该实际调用它？

您现在需要该功能吗？

比添加 () 来执行它

您是否需要引用函数以便稍后调用它？

不要添加 ()。

于 2013-04-08T18:30:12.190 回答
2

无论如何调用它，都需要在某处引用您的函数。这里的区别在于您没有显式调用该hello函数。您正在将对该函数的引用分配给elemDOM 节点的onclick事件处理程序，以便在onclick为该节点触发时，调用您的函数。

于 2013-04-08T18:30:34.160 回答
2

JavaScript 中几乎所有的语句都有返回值。除非另有说明，否则 JavaScript 中的函数将undefined在调用时返回。因此，如果要返回一个函数，则在此赋值语句中调用您的函数是有意义的唯一上下文：

function hello() {
    return function() {
        alert("hi!");
    }
}

elem.onclick = hello();
于 2013-04-08T18:32:02.037 回答
1

hello() 表示调用该函数，即直接执行该函数。

而当您有 elem.onclick = hello 时，这称为回调。hello 不会直接执行，但仅在触发某个事件时（在这种情况下，当单击元素时）

于 2013-04-08T18:31:27.647 回答