在JavaScript命名空间中共享变量

我的目标：为我的javascript命名名称空间，以保持全局名称空间干净

我的问题：如何在JavaScript命名空间中的方法之间共享变量

在我的示例中，我扩展并覆盖了ASP.net ModalPopupXtender的行为。我想知道如何与

ModalPopupShowOverride

和

modalpopupsdeoverride

共享

modalPopupStack

变量，而不使其成为全局变量

相关代码：

$(function () {
    if (Sys.Extended != undefined && Sys.Extended.UI != undefined && Sys.Extended.UI.ModalPopupBehavior != undefined) {
        MyPageMethods.ModalPopupShowOriginal = Sys.Extended.UI.ModalPopupBehavior.prototype.show;
        MyPageMethods.ModalPopupHideOriginal = Sys.Extended.UI.ModalPopupBehavior.prototype.hide;
        Sys.Extended.UI.ModalPopupBehavior.prototype.show = MyPageMethods.ModalPopupOverrides.ModalPopupShowOverride;
        Sys.Extended.UI.ModalPopupBehavior.prototype.hide = MyPageMethods.ModalPopupOverrides.ModalPopupHideOverride;
    }
});

var MyPageMethods = {

    ModalPopupShowOriginal: function () { },

    ModalPopupHideOriginal: function () { },

    ModalPopupOverrides: {

        modalPopupStack: new Array(),

        ModalPopupShowOverride: function () {

            var extender = this;
            var topElement;

            MyPageMethods.ModalPopupShowOriginal.apply(this, arguments);

            for (var x = 0; x < modalPopupStack.length; x++) {

                if ($(modalPopupStack[x].background).css("z-index") > $(extender._element).css('z-index') || $(modalPopupStack[x].popup).css("z-index") > $(extender._element).css('z-index')) {

                    if ($(modalPopupStack[x].background).css("z-index") > $(extender._element).css('z-index')) {
                        topElement = $(modalPopupStack[x].background).css("z-index");
                    }
                    else if ($(modalPopupStack[x].popup).css("z-index") > $(extender._element).css('z-index')) {
                        topElement = $(modalPopupStack[x].popup).css("z-index");
                    }

                }

            }

            if (topElement != undefined) {
                $(extender._backgroundElement).css('z-index', topElement);
            }

            modalPopupStack.push({ 'id': extender._id, 'background': extender._backgroundElement, 'popup': extender._element });

        },

        ModalPopupHideOverride: function () {
            var extender;
            MyPageMethods.ModalPopupHideOriginal.apply(this, arguments);
            extender = modalPopupStack.shift();
        }

    }

}

$（函数（）{
if（Sys.Extended！=未定义和&Sys.Extended.UI！=未定义和&Sys.Extended.UI.ModalPopupBehavior！=未定义）{
MyPageMethods.ModalPopupShowOriginal=Sys.Extended.UI.ModalPopupBehavior.prototype.show；
MyPageMethods.ModalPopupPhideOriginal=Sys.Extended.UI.ModalPopupBehavior.prototype.hide；
Sys.Extended.UI.ModalPopupBehavior.prototype.show=MyPageMethods.modalpopuverrides.modalpopushowOverride；
Sys.Extended.UI.ModalPopupBehavior.prototype.hide=MyPageMethods.modalpopuverrides.ModalPopupHideOverride；
}
});
var MyPageMethods={
modalpopuspshowOriginal:函数（）{}，
ModalPopupHideOriginal:function（）{}，
ModalPopupOverrides：{
modalPopupStack:新数组（），
ModalPopupShowOverride:函数（）{
var扩展器=此；
var topElement；
MyPageMethods.ModalPopupShowOriginal.apply（这是参数）；
对于（变量x=0；x$（extender.\u元素）.css（'z-index'）| |$（modalPopupStack[x].popup.css（“z-index”）>$（extender.\u元素）.css（'z-index'））{
if（$（modalPopupStack[x].background）.css（“z-index”）>$（extender.\u元素）.css（'z-index'））{
topElement=$（modalPopupStack[x].background）.css（“z-index”）；
}
else if（$（modalPopupStack[x].popup）.css（“z-index”）>$（extender.\u元素）.css（'z-index'））{
topElement=$（modalPopupStack[x].popup）.css（“z-index”）；
}
}
}
if（topElement！=未定义）{
$（extender._backgroundElement）.css（'z-index'，topElement）；
}
modalPopupStack.push（{'id'：extender.\u id，'background'：extender.\u backgroundElement，'popup'：extender.\u element}）；
},
ModalPopupPhideOverride:函数（）{
var扩展器；
MyPageMethods.modalPopupPhideoriginal.apply（这是参数）；
extender=modalPopupStack.shift（）；
}
}
}

---

我肯定有一个简单的解决方案，但我不确定它是什么。

听起来您希望变量在名称空间内可见，而不是在名称空间外可见。如果是这样，请尝试以下解决方案

var MyPageMethods = (function() { 
  // This variable is local to the namespace.  It can't be accessed from 
  // the caller
  var modalPopupStack = new Array();

  // These values are available to the callers as members of MyPageMethods
  return { 
    ModalPopupShowOriginal: function () { },

    ModalPopupHideOriginal: function () { },

    ModalPopupOverrides: { ... } 
  };
})();

---

此模式使用函数为命名空间的局部变量建立私有函数作用域。然后返回一个新对象，该对象包含可在命名空间之外访问的成员。这些定义出现在函数内部，因此它们可以访问命名空间私有数据

您可以使用以下两种方法引用该属性：

MyPageMethods.ModalPopupOverrides.modalPopupStack

这可能有点麻烦，因此您可能希望在每个方法中都使用别名，如下所示：

var modalPopupStack = MyPageMethods.ModalPopupOverrides.modalPopupStack;

---

请注意，该值在全局范围中仍然可见（与@JaredPar的答案不同），但它只是依靠现有的全局对象。

如果愿意，将其作为命名空间的一部分。或者，为了获得更多隐私，制作一个本地闭包，其中包含该闭包并公开您想要的功能：

var MyPageMethods = {
    ModalPopupShowOriginal: function () { },
    ModalPopupHideOriginal: function () { },
    ModalPopupOverrides: (function() {
        var modalPopupStack = new Array();
        var show = function () {
            // show implementation using modalPopupStack
        };
        var hide = function () {
            // hide implementation using modalPopupStack
        };
        return {
            ModalPopupShowOverride: show,
            ModalPopupHideOverride: hide
        }
    }())
};

顺便说一下，现在很少使用

newarray（）

。这通常是首选：

        var modalPopupStack = [];

---

它更短、更清晰、更显式。

让名称空间中有一部分可以由所有方法名称空间访问的变量。+1-如果您真的想限制对值的访问，那么这就是方法。