Javascript避免函数之间的全局变量

Question

我正在尽力使用全局范围的变量但我不确定实现这一目标的最佳方法，目前我有一个函数setSizes（），（这是在mousedown上运行一次）它获取所有测量和doStuff（） ，（这是在mousemove上不断运行），它使用所有大小来执行各种操作：

var sizes = {};
sizes.myWidth = 0;
sizes.myHeight = 0;
sizes.myPadding = 0;
sizes.myMargin = 0;

function setSizes(){
   //sets all sizes
}

function doStuff(){
  //does stuff with sizes
}

避免这种代码的最佳方法是什么？ 我发现自己不断地从“简单”中做到这一点，但我无法想象这是最有效的方式。

Answer 1

你可以在它周围放置一个新的范围

(function () {
    "use strict";

    var sizes = {};
    sizes.myWidth = 0;
    // ...

    function setSizes() {
        // ...
    }

    function doStuff() {
        // ...
    }
})();

或者，如果可能，只需将对象作为参数传递。 这有点取决于对我来说感觉更清洁的情况。 您必须问自己一个对象是仅与该函数相关还是与整个范围相关。

您也可以查看各种模块模式，因为它们将向您展示如何编写模块化代码的技术。 例如，要将特定模块与其他代码一起使用，只需将一个（且仅一个 ）变量导出为您自己的自定义命名空间：

(function (exports) {
    "use strict";

    var someVar = "I won't leak to the global space!";

    exports.yourObject = {
        someFunction: function () {
            // ...
        }
    };
})(window);

yourObject.someFunction();

这只是一个非常简单的示例，请查看更常见的示例以获得更好的示例。

Answer 2

(function () {
    var sizes = {
        myWidth: 0,
        myHeight: 0,
        myPadding: 0
        myMargin: 0
    };

    function setSizes(){
        //sets all sizes
    }

    function doStuff(){
        //does stuff with sizes
    }
}());

这个构造是一个IIFE（立即调用的函数表达式），这样你以前的全局函数在外面是不可见的，但只在IIFE的范围内。 顺便说一句，你使用了一个对象更适合的数组。