Javascript回调函数的差异

我想知道回调函数的两种实现之间的区别

这：

而不是已经定义了函数

$("#button").on('click', btnFunction);
function btnFunction() {
    //do something
}

---

一个与另一个相比有什么影响吗？性能方面更快吗？

第一个使用匿名函数，第二个不使用。两者没有区别

见：

---

有些人更喜欢第二种形式，因为在使用调试器和跟踪时，它会给出函数名，但在第一种形式中也有获得相同功能的方法

---

如果您根据不断变化的条件附加和删除事件处理程序，则第二种形式更易于维护。

在大多数情况下，将使用第一种形式，称为

当函数不仅在这里内联使用，而且还需要在其他地方重用时，将使用第二个函数

---

但无论如何，这可能是个人的偏好。

两者没有任何区别，也没有性能问题。唯一的区别是，在其中一个函数中，您将回调函数定义为匿名函数，这样您就无法重用它

另一种方法是，在别处定义它并命名它，然后将其作为回调传递，定义一个函数，以后可以在代码的另一部分中重用

例如：如果您想在文档准备就绪时执行某些操作，然后在有人按下按钮时执行完全相同的操作，则可以使用以下操作：

function getData() {
    //do something
}

$(function() {
    // Call the function once the DOM is ready
    getData();
});

// Call the same function when the button is clicked
$("#refresh_button").on('click', getData);

---

您可以看到的唯一真正的区别是，当使用第二个堆栈跟踪时，堆栈跟踪（例如，如果引发异常）会更好，即更易于调试。

只是重用功能

---

在第二种情况下，如果需要，可以在其他地方调用

btnFunction（）

。

没有功能上的差异，也没有明显的性能差异

function getData() {
    //do something
}

$(function() {
    // Call the function once the DOM is ready
    getData();
});

// Call the same function when the button is clicked
$("#refresh_button").on('click', getData);