Question

我无法理解在addItem()中没有括号的情况下如何调用removeItem()和addEventListener('click', addItem)。

var addButton = document.getElementById('add');
addButton.addEventListener('click', addItem);

var removeButton = document.getElementById('remove');
removeButton.addEventListener('click', removeItem);

function addItem(){
    console.log('Add Button clicked');
}

function removeItem(){
    console.log('Remove Button clicked');
}

Answer 1

没有括号，您实际上并没有在调用该函数。一种没有括号的函数名称是对该函数的引用。

Answer 2

因为在这种情况下，addItem被用作函数引用，而不是函数的返回值。

如果您这样做：

addButton.addEventListener('click', addItem());

然后将立即执行addItem，每当单击addButton时，将调用addItem的返回值（即undefined）。这将导致错误，因为undefined不是函数。

在这里，您说的是当我单击addButton时，查找我传递的函数引用，然后执行它。

您也可以用两种不同的方式编写这种文字：

addButton.addEventListener('click', "addItem()");
addButton.addEventListener('click', function() {
    addItem();
});

以上两种情况仍然会产生与原始代码相同的输出。

Answer 3

这是js的核心功能。您可以阅读有关此here.

的信息

函数是函数对象。在JavaScript中，任何不是基本类型（undefined，null，boolean，number或string）是一个东西。 JavaScript中的对象非常灵活。因为这样，我们甚至可以将一个函数作为参数传递给另一个函数

Answer 4

您将附加一个事件侦听器，它将调用该函数如果您在回调中添加括号，则会因执行呼叫而收到错误

Answer 5

这是因为要将函数作为参数/参数传递给addEventListener()方法。如果添加了上位机，该函数将立即执行，而这不是您想要的。您是在告诉addEventListener()在事件触发时执行哪个函数。

希望这会有所帮助。

Answer 6

第二个参数是 addEventlistener 方法函数。您可以在全局中定义该函数，而无需在第二个参数 addEventlistener 中添加括号。

在addEventListener中如何在不带括号的情况下使用该函数？

6 个答案: