解码 function(event) {} 的 JavaScript 语法答案

【问题标题】：Decoding the JavaScript syntax of function(event) {}解码 function(event) {} 的 JavaScript 语法
【发布时间】：2013-11-29 10:49:52
【问题描述】：

我刚刚在网上看到了这个小小的 JavaScript 代码：

exampleSocket.onopen = function(event) { // rest of code here;}

我对 function(event) 部分感到很困惑，因为没有可供我分析的 cmets。（在设计双向双工连接时，谁需要 cmets？哈哈）。

函数（事件）究竟是什么？我一直认为你必须用 javaScript 中的函数定义一个函数名。这是坏代码的例子吗？此外，（argument-parameter-whatever）“事件”甚至没有在代码的其他任何地方定义。只是bam。它在那里。是否有必要定义它，或者（事件）是一个特殊的预定义值？最后，如果将 (event) 替换为 (e) 之类的其他值，代码是否仍然有效？

谢谢

【问题讨论】：

是的，您可以将 event 替换为 e，这只是一个变量名。但可能该功能是由事件触发的。该函数有一个变量exampleSocket.onopen形式的名称。
@putvande 严格来说，这实际上不是函数的 name。
更多对匿名函数的引用？

标签： javascript function syntax

【解决方案1】：

你得到的是一个函数表达式，而不是一个函数语句。

在函数语句中，名称是强制性的。在函数表达式中它是可选的。具有名称的函数表达式称为命名函数表达式。没有的函数表达式称为匿名函数

在这个问题中涵盖的所有这些不同的函数声明方法之间存在许多细微的差异； var functionName = function() {} vs function functionName() {}

您在这里所做的是将exampleSocket 的onopen 属性设置为一个函数（表达式）。请注意，您根本没有运行该功能；您只是简单地声明它，并在 exampleSocket.onopen 中保存对它的引用。

这意味着某人可以通过调用执行该函数；

exampleSocket.open();

他们可以将参数传递给函数，您可以使用 event 变量在函数内部使用该参数（并回答您的问题；event 不是一个特殊的词。您可以将其称为任何东西)。

exampleSocket.onopen = function (event) {
    console.log(event); // will log "hello"
};

exampleSocket.open("hello");

变量event 没有在任何地方使用这一事实可能意味着开发人员已将参数命名为“嘿，看，如果你愿意，你可以使用它”，但在他的实际实现中并没有。

您不必自己声明变量。它已经通过在参数列表中命名来声明，并且当有人在调用函数时传递参数时，它将被初始化为一个值。

请注意，我们可以使用函数语句定义此事件处理程序；

function foo(event) {
    console.log(event);
}

exampleSocket.open = foo;

...或通过命名函数表达式：

exampleSocket.open = function foo(event) {
    console.log(event);
};

为了混淆（不用担心；这是 JavaScript 的一个怪癖），命名函数表达式的名称仅在函数本身内部可用；

exampleSocket.open = function foo(event) {
    console.log(event);

    console.log(typeof foo); // you'll get "function"
};

console.log(typeof foo); // you'll get "undefined"

...但是在函数语句中，您将能够从内部和外部访问名称。

我希望这会有所帮助......这有点像信息的“大脑转储”:)。

【讨论】：

那么，这是否意味着我使用语法 function(whatever) 创建的任何匿名函数表达式都是一个事件处理程序？
我注意到您在函数括号后加上了一个分号。像这样的功能有必要这样做吗？
@user3048961 您可以创建匿名函数并将对它们的引用保存在变量或对象属性中。在许多方面，它就像命名函数一样工作。这与事件处理程序无关。
@user3048961 在某些情况下需要分号。这是解释原因的答案：stackoverflow.com/questions/20048093/…
好吧，用我的头脑多一点...因为这是表达式的一部分，这意味着涉及到分配，对吧？分号是终止分配的现状。哦，看到你的评论了。

【解决方案2】：

这是一个匿名函数。函数是一个值，你可以像这样声明和存储函数。更多关于that syntax in this question的信息。

阅读代码（我认为它不需要比它已经拥有的更多的 cmets），您正在编写一个处理函数，该函数在套接字打开时调用。套接字打开事件将传递给变量event中的函数。

为什么是event？因为无论 API 是什么，都希望传入一个表示“打开”事件的参数。

【讨论】：

【解决方案3】：

这是一个简单常用的JS事件绑定函数。

它将一个匿名函数附加到“exampleSocket”的“open”事件。当触发此类事件时，将调用声明的函数。

每个事件可能有一些参数，其中包含有关事件本身的附加信息。您可以按照自己的方式命名该参数（“event”、“e”或“anythingElse”），然后您可以在匿名函数体中引用它。

【讨论】：

【解决方案4】：

您基本上是在为 exampleSocket.onopen 分配一个函数值，然后可以在其他地方调用它。想象一下这样的事情：

var obj = {};

obj.onsomething = function(a, b, c, d) {
    alert(a+b+c+d);
};

obj.onsomething(1, 2, 3, 4);

在这种情况下，我给 obj.onsomething 一个函数，它接受 4 个参数（应该是数字）并提醒总和。然后我可以用 4 个参数调用 obj.onsomething。

因此，您分配给 exampleSocket.onopen 的函数将在适当的时候被调用（例如，当套接字打开时）。

希望对您有所帮助。

【讨论】：