是否可以定义内联“静态” lambda箭头函数？

如何解决是否可以定义内联“静态” lambda箭头函数？

我的代码涉及许多事件处理程序，不需要任何上下文（范围）即可执行。与静态声明的（常量）lambda函数相比，当使用内联lambda函数时，每次分配事件处理程序时都会创建一个新的事件处理程序。

问题：是否可以定义一个 inline lambda函数，该函数不会在每次将lambda作为回调传递时都创建新的Function对象。 （鉴于不需要唯一的上下文范围。）

两个示例说明了符号和内存使用之间的权衡。

1。内联lambda ：（所需的符号，无需消耗内​​存）

for (const divId of ["div1","div2","div3"]) {
     documentgetElementById(divId).addEventListener("click",e => console.log(e));
}                                                         // Creates a new Function
                                                          // object for each loop
                                                          // cycle.

所需的符号，但是为每个Function创建一个新的e => console.log(e)回调（divId），尽管该回调不依赖于任何上下文信息（因此在功能上等效于每个{{1 }}。如果有一种方法可以仅将指针传递给该函数，那就太好了。

2。静态声明的lambda ：（不想要的表示法，所需的内存消耗量最小）

divId

不需要的表示法（需要额外的常量），但从正面看，对所有三个const staticLambda = e => console.log(e); // Function object created only once. for (const divId of ["div1",staticLambda); } 仅创建一次Function回调（staticLambda）。 想象一下，这在类方法内部看起来如何； lambda函数需要在其各自方法的外部声明为类的静态属性，从而破坏了lambda的优雅风格（它们很好地将回调代码保留在传递位置）。

注意：这是一个简化的示例。我意识到创建 2 （在3个中）不必要的回调不会显着影响性能，但是，我对正确处理具有数量级的回调的情况感兴趣。 em>

解决方法

您可能想要在函数中添加事件侦听器，如下所示：

function addListeners(ids,listener){
  for( const divId of ids){
     document.getElementById(divId).addEventListener("click",listener);
  }
}

现在您可以像这样调用函数了：

addListeners(["div1","div2","div3"],e => console.log(e));

,

虽然这些优化确实对性能有所帮助（Does use of anonymous functions affect performance?），但我认为它不会产生很大的影响，不应仅仅出于性能原因而进行追求，但是您的情况当然可以是有效的一个。

如果要管理许多事件侦听器，则还应注意在不使用它们时将其删除。如果仍然有对原始处理程序的引用，并因此声明处理程序在其附加作用域之外的某个位置，则删除事件侦听器是最简单的。

我还要指出，优良作法是将“简单”事件处理程序放在其自己的函数中，并将其保存在单独的模块或文件中，这使重构更加容易。这也解决了性能问题。

,

内存使用情况不应是您选择一种形式而不是另一种形式的原因。有两个原因：

1. 用法如此之小，以致在大多数情况下几乎无法测量。

2. JavaScript解释器很可能会在优化字节码或JIT机器代码时编译一个函数。

但是，由于其属性，您应该选择任何一种形式：

1. 使用相同的逻辑在多个地方声明隐式函数。总是寻找重构代码的机会，尤其是在命名函数时容易重构。修复错误时，它将减少将来的工作量。

2. 在每次调用函数时需要实例化新的闭包时，请使用IIFE（内联）。现代javascript可以将其编译为单个函数，但是每次“声明”该函数时，它们都会创建一个新的闭包。