将 onchange 函数事件附加到变量

Question

我最近进入了闭包和匿名函数，我想知道我的代码是否是正确的方法（它有效！）：

newInput.onchange = function(x){
     return function(){
          PassFileName(x);  
     }
}(counter);

所以这是一个循环，“保存”当前的“计数器”值（1,2 ,3...)。如果我没有返回函数，那么“counter”将始终是“counter”的最后一个值。

我用该代码正确地处理了这个问题吗？或者是否有更好的方法来“捕获”当前计数器并将其附加到 onchange 事件？

谢谢你！

Answer 1

是的，您正在正确地处理它，但是为了与实现实现最大程度的兼容性，您需要在函数周围放置括号：

    newInput.onchange = (function(x){
//                      ^--- here
         return function(){
              PassFileName(x);  
         }
    })(counter);
//   ^--- and here

每当您执行函数表达式并立即调用它时，您都需要这些括号，因为否则会存在解析歧义。

---

更新：

虽然你的方法很好，但值得指出的是它有点挥霍。 ;-) 它在循环的每次迭代中创建两个函数，外部匿名函数和内部匿名函数。这两个功能都会保留（除非实现优化，您知道某些引擎不会有）。相反，您可以每个循环只有一个加一个工厂函数：

// In the loop
newInput.onchange = makeHandler(x);

// Outside the loop
function makeHandler(x){
     return function(){
          PassFileName(x);  
     };
}

有些人可能认为它更容易阅读（我当然这么认为），前提是 makeHandler 仍然足够接近您不会丢失的循环追踪。

使用工厂函数还为您提供了不关闭范围内任何其他内容的机会，尽管您必须将工厂函数放在更远的地方（例如，在一个包含良好的范围中）。

您还可以考虑使用通用的 curry 函数，例如 Prototype 提供的。一种不会传递调用时参数的通用curry看起来像这样：

function curry(f) {
    var args = arguments;
    return function() {
        f.apply(undefined, args);
    };
}

但是拥有一个会<的通常会更有帮助（但更昂贵） /em> 也传递运行时参数。这是一种廉价而肮脏的方法（未优化；通过优化，可以显着减少调用时间开销）：

function curry(f) {
    var args = Array.prototype.slice.call(arguments, 1);
    return function() {
        f.apply(undefined,
                args.concat(Array.prototype.slice.call(arguments)));
    };
}

这两种情况的优点是您不会关闭任何可以避免的新内容。

---

离题：此外，技术上，您依赖的是分号插入的恐怖（您的返回符末尾应该有一个分号 声明），我一直主张不要依赖它。不过，在这个例子中非常安全。 ;-)

Answer 2

你所做的事情是相当标准的，没有什么问题。然而，我更喜欢一种类似的方法：

(function (x) {
    newInput.onchange = function () {
        PassFileName(x);
    };
})(counter);

对我来说，通过包装整个块（并带有缩进），我正在考虑创建一个新的作用域以捕获变量的值，这会更清楚。