javascript - 如何在定义函数时捕获外部变量的当前值

Question

我经常以编程方式将处理程序附加到 DOM 中的元素，这些元素依赖于稍后可能会更改的变量。

nextID = "#content-" + dataElement.elementBack;
something.on("change", function (e) {
    $(nextID).css({left: 0, position:'fixed', zindex: -1});
});

触发此函数时，nextID 的值已更改并作用于错误的元素。

有没有办法在变量首次定义或附加到事件时使用函数中变量的当前值？

(请不要建议我在其中硬编码元素而不是 nextID。如果我愿意，我可以。)

Answer 1

解决方法是使用自调用函数:

nextID = "#content-" + dataElement.elementBack;

(function(nextID) {
    something.on("change", function (e) {
        $(nextID).css({left: 0, position:'fixed', zindex: -1});
    });
})(nextID);

函数在 JavaScript 中创建新的作用域，因为你给了 nextID作为参数，nextID得到作用域，它将在 change 时被捕获并可用。事件被触发。

这是因为 JavaScript 不会为除函数之外的任何其他语言构造创建作用域。例如，for喜欢for(var i = 0; i < 10; i++) {}不会创建范围，一旦循环结束，i在当前范围内可用，它将包含 10 .

我建议你看看 let 下一版 ECMA-Script (ECMA-Script 6) 的关键字部分，它将让我们创建 block 范围的变量。