jQuery中的事件绑定

Question

以下是否有任何区别:(有没有理由避免示例一？）

一：

$("#stuff").on("resize", function() { doThis(); });
$("#stuff").on("resize", function() { doThat(); });

二：

$("#stuff").on("resize", function() { 
  doThis(); 
  doThat();
});

Answer 1

直截了当，没有真正的区别。

在真实世界的代码中，

• 您可能需要在代码中的不同位置附加两个处理程序，在这种情况下，您必须使用版本One（或类似）。
• 您可能希望能够有选择地分离处理程序，在这种情况下，事件可以如下命名空间：

附加处理程序：

$("#stuff").on("resize.A", function() { doThis(); });
...
$("#stuff").on("resize.B", function() { doThat(); });

分离一个处理程序：

$("#stuff").off("resize.A");

resize.B的处理程序仍然附加（即。doThis()将不会被调用，但doThat()将被调用。

Answer 2

在第二个示例中，如果doThis()抛出异常，则doThat()将无法运行。与第一个例子不同。

Answer 3

唯一的区别是存储并执行了两个不同的事件处理函数，而第二个片段对其中一个感到满意。

算一算，第二个片段更优雅。我不会开始谈论性能，但如果我们以这种方式绑定“数百个”方法，很明显你不想绑定多个处理程序。

Answer 4

第二个会更高效。

在第一个例子中，当调用resize事件时（除了调用doThis和doThat之外），你有两个函数调用的开销。在第二个示例中，您只调用了一个事件处理程序。