Javascript (jQuery) 中的全局变量

Question

所以这是我第一次在更强大的环境中使用 Javascript，拥有一个胖客户端并通过 javascript 本身完成大部分繁重的工作。我正在使用 jQuery，现在很多代码都变得很混乱，因为它只是一堆函数。

对于我的一些函数，我需要通过多个函数传递变量，并保持它们的值。这样做的明显方法是将它们声明在函数范围之外，然后让函数以它应该的方式对其进行操作。 （这些变量是对象而不是原始类型，所以我猜 javascript 是通过引用传递的，这是可行的）。

例如，我可能有这样的事情

var node = //init with some value;

$(document).ready(setup);
function setup()
{
 A();
 B();
}

function A()
{
  // operate on var node
}

function B()
{
  // operate on var node
}

这显然是我的代码的缩小版本，但捕获了我处理全局变量的方式。我的问题是，有没有更优雅的方式来完成上述操作？

谢谢

Answer 1

任何你做不到的理由：

$(document).ready(function() {
    var node = //init with some value;
    setup(node);

    function setup(node) {
        A(node);
        B(node);
    }

    function A(node) {
      // operate on var node
    }

    function B(node) {
      // operate on var node
    }
});

一般来说，使用全局变量和函数是个坏主意，应尽可能避免。

Answer 2

请注意，虽然您似乎一直在专门询问 node，但您的函数 setup、A 和 B也是您版本中的所有全局变量。

最简单的方法是将所有这些声明放在一个匿名函数中：

$(document).ready(function() {

    var node = ...;

    function A() {
        ...
    }

    function B() {
        ...
    }

    function setup() {
        A();
        B();
    }

    setup();
});

Answer 3

只使用一个全局变量（或尽可能少）。使任何函数或对象成为您的一个全局变量的成员。

道格拉斯·克罗克福德说

JavaScript 程序质量的客观衡量标准是如何 它有很多全局变量和全局函数吗？一个大的 数字不好，因为与其他人发生不良互动的机会 程序上升。理想情况下，应用程序、库、组件或 小部件只定义了一个全局变量。该变量应该是 一个对象，它包含并且是您所有的根命名空间 东西。

雅虎的单一全球是雅虎。它全部大写以识别 它很特别，因为所有小写字母都是普通的和初始的 caps 表示构造函数。全部大写，不太可能 有人会不小心使用它，这进一步减少了 碰撞的可能性。

http://www.yuiblog.com/blog/2006/06/01/global-domination/

此外，您可以创建对象来进一步组织您的代码。

GLOBAL.myObject = {}; GLOBAL.myObject.myFunction = ...

Answer 4

我更喜欢"revealing module" pattern：

var myApp = (function () {
    // privates
    var node;

    var a = function () {
        // operate on node
    };

    var b = function () {
        // operate on node
    };

    // publics
    var init = function () {
        // initialization stuff
        a();
        b();
    };

    return {
        init: init
    };
})();

$(document).ready(function () {
    myApp.init();
});

这样您就只有一个全局变量myApp，它存储您的应用所需的所有其他内容。

Answer 5

我认为这会使代码更难理解，我宁愿将变量作为参数并将其作为返回值。

$(function(){
    var outcome = multiply(add(5));
});

function add(num)
{
    return num+1;
}

function multiply(num)
{
    return num*5;
}

如果你觉得你绝对想让全局变量将你的东西包装在一个闭包中，这样它就不会真正进入全局范围。

即，

(function(){
    var a; // can be used in any functions within this closure, but not polluting window
    function A()
    {
        a = 'blah';
    }
})();

Answer 6

有很多。例如，对象。

// jQuery shorthand for "wait till DOM ready"
$( function() {
   // create node object
   var node = {
      id: /* some value */,
      setup: function() {
         this.A();
         this.B();
      },
      A: function() {
         // operate on this.id
      },
      B: function() {
         // operate on this.id
      }
   };
   // setup node object
   node.setup();
} );

全局变量是等待发生的麻烦。不要弄脏你的全局命名空间。 Javascript是一种面向对象的语言，使用对象。请注意，您的对象可以有一个属性，您可以在对象方法中使用 this 关键字引用该属性。