復述一遍阮一峰的blog，加深印象

博客地址 ?http://www.ruanyifeng.com/blog/2012/10/javascript_module.html

?

? 1.函數 function m1(){} ?這樣函數里的新函數或者var的對象就不會污染全局;

? 2.對象寫法

　　代碼優點：

　　1）多個有關聯的變量或者函數不污染全局，可以這樣在前面加一個module1的名字

　　2）可以保證 new object里的key之間有一些邏輯上的聯系

var module1 = new Object({_count : 0,m1 : function (){alert(_count); //報錯 　　　　},m2 : function (){//... 　　　　}});

　調用時 ? module1.m1();? ?

　注意：key他們都是平行的。平行的意思是？看以下說明

? ?　　如果在全局變量中寫以下代碼

var count = 0;function m1(){alert(count); //0 }function m2(){
m1();
}

? 　　?m1里是可以獲取count的，m2里也可以調用m1。但是在module1里，各個函數和變量不可以相互引用，引用的話就如第一段代碼中的alert那里會報錯。

? ?所以平行的意思就是，module1里的_count,m1,m2都是一樣大的官，誰都不能調用誰支使誰。

? ?代碼缺點：外部可以修改module1內部內容 ， 如 module1._count = 1;

??

3.模塊函數寫法

var module1 = function(){var _count = 0;var m1 = function(){alert(_count);};var m2 = function(){//... 　　　　};return {m1 : m1,m2 : m2};}$('#button').click( function(){module1().m1(); //0});

?

優點：1）可以私有函數或變量 ，如_count,function private

　　　2）外部無法改變

? ? 下面驗證了代碼無法改變，click的時候根本就無法進入修改m1的代碼

$('#button').click( function(){module1().m1 = function(){ //未進入alert(2);}module1().m1();});

? 立即執行函數寫法

　var module1 = (function(){var _count = 0;var m1 = function(){//... 　　　　};var m2 = function(){//... 　　　　};return {m1 : m1,m2 : m2};})();

這樣可以直接執行module1 就不用像上面那個代碼再module1()才能生效模塊里面的內容了

?

轉載于:https://www.cnblogs.com/cjy1993/p/3897236.html

總結

以上是生活随笔為你收集整理的js模块化小结的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。