• 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,_));
    View Code

    四、暴露式模块模式 

    当我们想要在一个公有方法中调用另外一个公有方法,或者访问公有变量的时候,我们不得不重复主对象的名称。他也不喜欢模块模式中,当想要将某个成员变成公共成员时,修改文字标记的做法。因此在这个模式中,我们可以简单地在私有域中定义我们所有的函数和变量,并且返回一个匿名对象,这个对象包含有一些指针,这些指针指向我们想要暴露出来的私有成员,使这些私有成员公有化。

    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/
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

  • 相关阅读:
    nginx-consul-template
    安装calico
    安装docker
    etcd集群安装
    安装consul-client+registrator
    command not found 的解决&&解释
    安装consul
    RAC环境下SCAN IP可以PING通,1521端口也可以TELNET,但是无法建立数据库连接
    Error starting daemon: error initializing graphdriver: devmapper: Device docker-thinpool is not a thin pool
    nginx+keepalived高可用
  • 原文地址:https://www.cnblogs.com/persist-confident/p/4515202.html
Copyright © 2020-2023  润新知