javascript 模块化模式总结(二)
一、对象字面值
这种设计模式中,一个对象被描述为一组以逗号分隔的名称/值对括在大括号({})的集合。对象内部的名称可以是字符串或是标记符后跟着一个冒号":"。在对象里最后一个名称/值对不应该以","为结束符,因为这样会导致错误。
例如:var myModel = {
myProperty : "someValue", //对象字面值包含了属性和方法,例如我们可以定义一个模块配置进对象里边 myConfig:{ useCache : true, language : "en" }, //非常基本的方法 myMethod : function(){ console.log(" this is myMethod"); }, //输出基于当前的配置 myMethod1 :function(){ console.log("Cache is:"+ (this.myConfig.useCache)? "enabled" : "disabled" ); }, //重写当前的配置 myMethod2 : function(newConfig){ if(typeof newConfig == "object"){ this.myConfig = newConfig;
consle.log(this.myConfig.language);
} } }
1、myModel.myMethod();
输出:this is myMethod
2、myModel.myMethod1();
输出:Cache is:enabled
3、myModel.myMethod2({ language: "zh", useCache : false });
输出: zh
二、使用自包含的模块实现了模块模式
这种模式的特点:
- 可以创建只能被我们模块访问的私有函数。这些函数没有暴露出来(只有一些API是暴露出来的),它们被认为是完全私有的。
- 当我们在一个调试器中,需要发现哪个函数抛出异常的时候,可以很容易的看到调用栈,因为这些函数是正常声明的并且是命名的函数。
- 这种模式同样可以让我们在不同的情况下返回不同的函数。
例如:
1 var basketModel = ( function(){ 2 var basket = []; 3 function dosomethingPrivate() 4 { 5 } 6 function dosomethingElsePrivate() 7 { 8 } 9 // Return an object exposed to the public 10 return{ 11 // Add items to our basket 12 addItem : funtion(values){ 13 basket.push(values); 14 }, 15 // Get the count of items in the basket 16 getItemCount : function(){ 17 return basket.length; 18 }, 19 dosomething : dosomethingPrivate, 20 getTotal : function(){ 21 var q = this.getItemCount(); 22 p = 0; 23 while(q--){ 24 p += this.basket[q].price; 25 } 26 return p; 27 } 28 }; 29 }()); 30 31 使用方法: 32 basketModule.addItem({ item: "bread", price: 0.5}); 33 basketModule.addItem({ item: "butter", price: 0.3}); 34 //Outputs: 2 35 console.log( basketModule.getItemCount() ); 36 //Outputs: 0.8 37 console.log( basketModule.getTotal() ); 38 //undefined 39 console.log( basketModule.basket ); 40 //undefined 41 console.log( basket );
三、Import mixins(导入混合)
这个变体展示了如何将全局(例如 jQuery)作为一个参数传入模块的匿名函数。
这种方式允许我们导入全局,并且按照我们的想法在本地为这些全局起一个别名。
1 var myModel = (function(JQ,_){ 2 function privateMethod1(){ 3 jQ(".container").html("test"); 4 } 5 function privateMethod2(){ 6 console.log( _.min([10, 5, 100, 2, 1000]) ); 7 } 8 return { 9 publicMethod : function(){ 10 privateMethod1(); 11 } 12 } 13 14 }(JQ,_));
四、暴露式模块模式
当我们想要在一个公有方法中调用另外一个公有方法,或者访问公有变量的时候,我们不得不重复主对象的名称。他也不喜欢模块模式中,当想要将某个成员变成公共成员时,修改文字标记的做法。因此在这个模式中,我们可以简单地在私有域中定义我们所有的函数和变量,并且返回一个匿名对象,这个对象包含有一些指针,这些指针指向我们想要暴露出来的私有成员,使这些私有成员公有化。
var myRevealingModule = function () { var privateCounter = 0; function privateFunction() { privateCounter++; } function publicFunction() { publicIncrement(); } function publicIncrement() { privateFunction(); } function publicGetCount(){ return privateCounter; } // Reveal public pointers to // private functions and properties return { start: publicFunction, increment: publicIncrement, count: publicGetCount }; }(); myRevealingModule.start();
转载请注明来源于
作者:
persist
出处:
http://www.cnblogs.com/persist-confident/
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。