Javascript闭包变量性能

我有一个函数可以绑定不同的表单输入

function bindInputs() {
    $(".inputContainer").each(function(i){
        var inputContainer = $(this),
            input = $("input.input", inputContainer),
            inputType = inputContainer.attr("data-inputType"),
            input_Id = inputContainer.attr("id").replace("inputContainer_", "");


        if(inputType == "TextEditor") {
            input.unbind("change").bind("change", function() {
                inputContainer.removeClass("nullValue");
                var value = input.val();
                saveInputValue(input_Id, value);
            });

            return true;
        }

        if(inputType == "NumericEditor") {
            input.numeric({ allow: "." });
            input.unbind("change").bind("change", function() {
                inputContainer.removeClass("nullValue");
                var value = getNumericValue(input.val());
                saveInputValue(input_Id, value);
            });
        }

        // so on
    });
};

此函数是否会导致内存泄漏？我担心的是，我将所有共享变量放在最上面，并在“更改”回调函数中使用它们

如果我重新计算回调函数上的共享变量，会有不同吗

if(inputType == "TextEditor") {
    input.unbind("change").bind("change", function() {
        var elem = $(this),
            inputContainer = elem.closest(".inputContainer"),
            input_Id = inputContainer.attr("id").replace("inputContainer_", "");

        inputContainer.removeClass("nullValue");
        var value = input.val();
        saveInputValue(input_Id, value);
    });

    return true;
}

它不会造成泄漏。只要这些函数在内存中，它就在内存中保存这些变量

你是否想这样做取决于你自己，这是一种权衡。对于

change

处理程序，重新查询DOM的开销最小，因此可以使用第二个示例，尽管在该示例中保留的内容对内存的实际影响相当小。在

mousemove

处理程序中，您可能会选择另一种方式，因为

mousemove

处理程序需要非常快速地完成工作

请在下面的评论中回答您的问题：

说我将选择第二种方法，我将如何防止浏览器保存顶级变量？我在函数末尾将它们设置为null

如果要使函数不依赖于

bindInputs

函数中的任何内容，请在函数之外完全定义它们。然后，在调用

bindInputs

的上下文中根本不创建任何闭包，该上下文可以是GC'd（以及它包含的任何变量）。将变量设置为

null

或

undefined

只是将它们设置为

null

或

undefined

，并不能消除它们。（尽管在这一点上，包含它们的上下文非常小。只有三个或四个变量没有引用任何特定内容。）

下面是可能的情况：

function bindInputs() {
    $(".inputContainer").each(function(i){
        var inputContainer = $(this),
            input = $("input.input", inputContainer),
            inputType = inputContainer.attr("data-inputType");


        if(inputType == "TextEditor") {
            input.unbind("change").bind("change", handleTextEditorChange);

            return true;
        }

        if(inputType == "NumericEditor") {
            input.numeric({ allow: "." });
            input.unbind("change").bind("change", handleNumericEditorChange);
        }

        // so on
    });
}

function handleTextEditorChange() {
    // ...implementation...
}

function handleNumericEditorChange() {
    // ...implementation...
}

它不会造成泄漏。只要这些函数在内存中，它就在内存中保存这些变量

你是否想这样做取决于你自己，这是一种权衡。对于

change

处理程序，重新查询DOM的开销最小，因此可以使用第二个示例，尽管在该示例中保留的内容对内存的实际影响相当小。在

mousemove

处理程序中，您可能会选择另一种方式，因为

mousemove

处理程序需要非常快速地完成工作

请在下面的评论中回答您的问题：

说我将选择第二种方法，我将如何防止浏览器保存顶级变量？我在函数末尾将它们设置为null

如果要使函数不依赖于

bindInputs

函数中的任何内容，请在函数之外完全定义它们。然后，在调用

bindInputs

的上下文中根本不创建任何闭包，该上下文可以是GC'd（以及它包含的任何变量）。将变量设置为

null

或

undefined

只是将它们设置为

null

或

undefined

，并不能消除它们。（尽管在这一点上，包含它们的上下文非常小。只有三个或四个变量没有引用任何特定内容。）

下面是可能的情况：

function bindInputs() {
    $(".inputContainer").each(function(i){
        var inputContainer = $(this),
            input = $("input.input", inputContainer),
            inputType = inputContainer.attr("data-inputType");


        if(inputType == "TextEditor") {
            input.unbind("change").bind("change", handleTextEditorChange);

            return true;
        }

        if(inputType == "NumericEditor") {
            input.numeric({ allow: "." });
            input.unbind("change").bind("change", handleNumericEditorChange);
        }

        // so on
    });
}

function handleTextEditorChange() {
    // ...implementation...
}

function handleNumericEditorChange() {
    // ...implementation...
}

---

---

比较好的

更改

和

鼠标移动

：）非常好的解释，谢谢。说我将选择第二种方法，我将如何防止浏览器保存顶级变量？我在函数末尾将它们设置为null？@RaraituL:我已经更新了答案以解决您的问题。最好，@T.J.Crowder:太好了，在你删除评论后我一直在寻找：）@RaraituL:LOL是的，我意识到它确实需要一个代码示例，应该在答案中取而代之。：-）很高兴这有帮助！比较好的

更改

和

鼠标移动

：）非常好的解释，谢谢。说我将选择第二种方法，我将如何防止浏览器保存顶级变量？我在函数末尾将它们设置为null？@RaraituL:我已经更新了答案以解决您的问题。最好，@T.J.Crowder:太好了，在你删除评论后我一直在寻找：）@RaraituL:LOL是的，我意识到它确实需要一个代码示例，应该在答案中取而代之。：-）很高兴这有帮助！您的代码无法运行，它有额外的双引号导致语法错误（在

input=$（“input.input”，inputContainer”）

行中）。首先，请发布有效的代码。抱歉，这只是一个解释问题的示例，不是应该编译的代码。是的，我有一个键入错误，我会修复它。你太挑剔了！@ShadowWizard，它很快就被修复了…然后再次被修复以确保正确。经常会出现键入错误，这是一个错误，没什么大不了的…@Ian，因为这些都是错误ngs可能是问题的根源，修复它们有时会使整个问题变得毫无意义。在这个特定的问题上可能不是这样，但最好小心点。您的代码不会运行，它有额外的双引号，导致语法错误（在

input=$（“input.input”，inputContainer”）

行中）。对于开始，请发布有效代码。抱歉，这只是一个解释问题的示例，而不是应该编译的代码。是的，我有一个打字错误，我会改正的。你太挑剔了@暗影巫师很快就被修复了…然后又被修复为正确的。输入错误是经常发生的，所以，这是一个错误，没什么大不了的…@Ian，因为这些东西可能是问题的根源。修复它们有时会使整个问题变得毫无意义。在这个具体问题上可能不是这样，但最好谨慎行事。