2011-04-17 50 views
4

我想創建一個命名空間或全局對象,將舉行現場廣泛使用的功能等建議命名空間設置的網站,網頁的特定對象等

此外,在特定的網頁,我想創建一個對象,將基於當前頁面保持狀態,並且如果用戶已登錄,如果是,則我將根據當前用戶提取狀態信息。

這是什麼建議模式?

回答

7

JavaScript沒有名稱空間。然而,當我們大多數人在JavaScript的上下文中引用命名空間時,我們的真正意思是以模塊化的方式將我們的函數和數據存儲在對象中,而不會混淆全局上下文。

有跡象表明,處理依賴管理和腳本加載幾個庫,但我不打算覆蓋所有的,現在右:

要創建一個命名空間,你必須首先在全球範圍內創建一個對象。

創建一個命名空間:

在最基本的層面上,這是那麼容易,因爲:

window["MyOrg"] = {}; 

通常情況下,你的基本對象不會有任何數據或功能,而是要成爲由子模塊組成。創建子模塊的最基本的形式是幾乎相同的:

MyOrg.submodule = {} 

可以將此模式擴展到任何你想要的水平。例如MyOrg.submodule.tools.usefulFunction


注意:如果您要定義模塊,並在可能的任意順序加載不同的文件子模塊,您必須先檢查,看看你的命名空間(和任何父模塊)存在這樣1)定義模塊時不會出錯,2)不會覆蓋任何模塊,但會增加它們。

例如,如果你定義了MyOrg.submodule模塊,你需要包括:

var MyOrg = MyOrg || {}; 
MyOrg.submodule = MyOrg.submodule || {}; 

現在,你有你的子模塊的設置,你可以使用預期的容易爲其指定成員註釋:

MyOrg.submodule.add = function (x, y) { 
    return x + y; 
} 

MyOrg.submodule.CONSTANT = 42; 

如果你能保證你所定義的子模塊的第一次(無覆蓋任何東西的風險),你也可以使用:

MyOrg.submodule = { 
    add: function (x, y) { 
     return x + y; 
    }, 
    CONSTANT: 42 
}; 

「高級」 方法

好吧,你應該得到關於它的精神。不過,也有,你可以按照稍微更先進的模式,特別是「模塊模式:」

MyOrg = MyOrg || {}; 
MyOrg.submodule = (function() { 
    /* any variables (incl. functions) in here are effectively private -- they 
     cannot be accessed or modified unless they are explicitly exposed. */ 
    var privateVariable = 42; 

    /* We return an object that will define the public API. Functions defined 
     in this object still have access to our "private" scope */ 
    return { 
     getVar: function() { 
      return privateVariable; 
     }, 
     setVar: function (value) { 
      privateVariable = value; 
     } 
    }; 
})(); 

您使用使用完全相同的符號你的模塊,但有私有變量和函數的好處:

MyOrg.submodule.setVar(2); 
MyOrg.submodule.getVar(); // 2 

關於你提到的第二個問題,還有你能做到這幾個方面。

首先,你可以添加產生在已經出爐的相關數據在服務器端的JavaScript。

var MyOrg = MyOrg || {}; 
MyOrg.userInfo = { 
    userName: "<%= @user.user_name %>", 
    location: "<%= @user.location %>" 
    //etc. 
} 

您也可以使用AJAX和JSON

從客戶端服務器獲取它
$.ajax({ 
    url: "user/getInfo", 
    success: function (data) { 
     // data is an object created from a JSON string containing info for the 
     // current user, presumably using session data. 

     alert(data.userName) 
    } 
}); 

如果您使用此方法,您可能必須在您的用戶模塊中使用回調以獲取相關信息,或者您可以實施緩存方法(還有額外的好處是不會創建如此多的服務器請求)。

+0

+1非常好的解釋...精彩 – kobe 2011-04-18 02:36:50

1

你或許可以宣告基本JavaScript文件base.js和定義各種namesspaces如下

基地命名空間

yourcompany.Projectname = {}; 
yourcompany.Projectname.modules = {}; 
yourcompany.Projectname.components = {}; 

,然後在每一個JavaScript文件,你可以用上面的命名空間創建函數

+0

請注意,除非您已經定義了'var yourcompany = {};否則這將不起作用,否則這裏的第一行會給您一個錯誤。 – nrabinowitz 2011-04-18 00:13:47

+0

@nra,是的那是正確的,我忘了包括那部分... – kobe 2011-04-18 03:04:21