javascript - 重用没有全局变量的函数？

Question

几天前，我在自己的示例中了解到全局变量和函数有多么糟糕。所以显然最好的解决方案是不使用它们，但是迟早我需要一遍又一遍地重用我的变量和函数。

所以我的问题是:我可以在不全局声明的情况下重用我的函数和变量吗？可以吗？

例如，我想重复使用我的 alertBox 函数和我的 containsP 变量几次:

演示:http://jsfiddle.net/ajmyZ/

//I am BAD GLOBAL FUNCTION inside var 
//But I am reusable!!! 

var alertBox = function () {
    alert("Hey I am BAD function!!")
}





$(document).ready(function () {
    //I am BAD GLOBAL var 
    //But I am reusable TOO!!! 
    var containsP = $("div p:first");
    containsP.click(function () {
        alert("Hi BAD var HERE!!");
    });

    $("p").eq(1).click(function () {
        alertBox();
    });

    //I am the NICEST function here
    //but I am NOT reusable :(

    $("p").eq(2).click(function () {
        alert("I am the NICEST function here!!");

    });

});

Answer 1

我想避免破坏全局对象的最简单方法就是创建您自己的“应用程序上下文”。您可以通过创建一个将整个 js 代码包装在每个文件中的自调用函数来做到这一点。

(function( win ) {
    "use strict";

    var still_global_but_only_in_this_anonymous_closure = true;

    $(document).ready(function() {
         // ...
         // accessing the global object:
         win.some_global_property = true;
    });
}( this ));

实际上，您已经使用传递给 .ready() 的匿名函数创建了这样一个本地上下文。这只是更明确的方式。该自调用方法只是以全局对象作为参数调用自身(您仍然可以在其中显式访问全局变量)。此外，通过调用 "use strict"; 可以避免意外创建全局变量 "Ops_I_Forgot_The_Var_Statment = true;