起因
將**組織到類中的乙個重要原因是讓**更加「模組化」,可以在很多不同的場景中實現**的重用。但類不是唯一的模組化**的方式。
一般來講,模組是乙個獨立的js檔案。模組檔案可以包含乙個類定義、一組相關類、乙個實用函式庫或者一些待執行的**。
模組化的目標是支援大規模的程式開發,處理分散源中**的組裝,並且能讓**正確執行,哪怕包含了不需要的模組**,也可以正確執行**。
理想狀態下,所有模組都不應當定義超過乙個全域性標識。
模組函式
通過把模組定義在某個函式的內部來實現,定義的變數和函式都屬於該函式的區域性變數,在函式外不可見。實際上,可以將這個函式作用域用做模組的命名空間(模組函式)
一旦將模組**封裝進乙個函式中,就需要一些方法匯出公用api,以便在模組函式外部呼叫它們。下面有幾種方式匯出公用api:
首先建立乙個命名空間
// 建立乙個全域性變數用來存放與學校相關的模組
var school; // 建立school命名空間
if(!school) school = {};
1. 利用建構函式
// 返回student建構函式來匯出公共api
school.student = (function()
// ...... 定義student的原型物件和私有屬性和方法 ........
return student; // 返回student構造方法匯出公共api
})();
2. 返回命名空間物件
如果模組api包括多個單元,則它可以返回命名空間物件
// 為school新增students模組
school.students = (function()
function grade()
// 通過返回命名空間物件將api匯出
return ;
})();
3. 通過關鍵字new呼叫
另外一種類似類似技術:把模組函式當做建構函式,通過new來呼叫。把它們(公共api)賦值給this屬性來將其匯出
school.students = (new function() ()); // 括號寫在裡面。這裡是建立新例項,new後面應緊跟建構函式的呼叫而不是表示式
4. 已定義命名空間物件
作為一種替代方案,如果已經定義了全域性命名空間物件,通過模組函式可以直接設定那個物件的屬性。
// 如果已經定義了命名空間物件
var school; // 建立school命名空間
if(!school) school = {};
school.students = {}; // student命名空間已經定義
(function(students) )(school.students);
Js中的模組函式和命名空間的介紹
命名空間namespace 某些語言中叫package 是乙個在靜態語言中常見的概念。它可以幫助我們更好地整理 並可避免命名衝突。遺憾的是,js中並不提供原生的命名空間支援。在js中建立的任何物件都預設是全域性物件。在現代的大規模js開發中,不採用命名空間會造成非常糟糕的命名方式,比如用字首命名函式...
JS命名空間
命名空間namespace 某些語言中叫package 是乙個在靜態語言中常見的概念。它可以幫助我們更好地整理 並可避免命名衝突。舉乙個簡單的例子,如果有兩個人都叫小明,我們很難區分和引用這兩個人。但如果我們在他們前面加上命名空間,比如 北京的小明和上海的小明,那麼區分起來就容易的多了,也不會因為重...
JS命名空間with
眾所周知乙個頁面可能會被很多人開發,那麼這時候就有乙個問題,那就是命名的重複 變數,函式名 所以為了解決這個問題,命名空間就應用而生了。可以先看如下 var org jerry groupb org.groupa.jerry.name那麼此時可以發現,如果要使用某個變數,那麼要層層呼叫,但是這回很麻...