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

Javascript avoid global variables between functions

本文关键字：全局变量 之间 函数 Javascript      更新时间：2023-09-26

我正在尽力使用具有全局范围的变量来aviod，但我不确定实现这一目标的最佳方法，目前我有一个函数setSizes（），（这在鼠标按下时运行一次）获取所有测量值和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
}

避免此类代码的最佳方法是什么？我发现自己出于"简单"而不断这样做，但我无法想象这是最有效的方法。

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

(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();

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

(function () {
    var sizes = {
        myWidth: 0,
        myHeight: 0,
        myPadding: 0
        myMargin: 0
    };
    function setSizes(){
        //sets all sizes
    }
    function doStuff(){
        //does stuff with sizes
    }
}());

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

相关文章：