JavaScript 设计模式之构造函数模式

1、构造函数模式概念解读

  1.构造函数模式概念文字解读

      构造函数用于建立特定类型的对象——不只声明了使用的对象，构造函数还能够接受参数以便第一次建立对象的时候设置对象的成员值。你能够自定义本身的构造函数，而后在里面声明自定义类型对象的属性或方法。

      在JavaScript 里，构造函数一般是认为用来实现实例的，JavaScript没有类的概念，可是有特殊的构造函数。经过new 关键字来调用自定义的构造函数，在构造函数内部，this 关键字引用的是新建立的对象。

  2.构造函数模式概念拟物化解读

     门建立出来是要归属于某我的的，即，有使用对象（小王或小李）。门能够有多把钥匙。门能够有各类花边和形状。

    （厂家原始的门，客户要求的门）

2、构造函数模式的做用和注意事项

  模式做用：

    1.用于建立特定类型的对象。

    2.第一次声明的时候给对象赋值。

    3.本身声明构造函数，赋予属性和方法。

  注意事项：

    1.声明函数的时候处理业务逻辑。

    2.区分和单例的区别，配合单例实现初始化。

    3.构造函数建议大写字母开头。

    4. 注意new 的成本。（继承）尽可能把公用的功能放到原型上去，具体再扩展。

 

3、构造函数模式的代码实战和总结

 1.一个通俗的例子

<meta charset="utf-8"/>
<script type="text/javascript">
     //1.用于建立特定类型的对象
     //2.js开发的时候写单引号
     //造门
     function makeDoor(){
         //instanceof 指向当前父类
        if (!(this instanceof makeDoor)) {
                return makeDoor();
        };

         this.lock="普通";  //门上的锁
         this.figure="普通"; //门上的花纹
        this.create=function(){   //开始产门
            return  "【锁头】"+this.lock+"【花纹】"+this.figure;
        }
     }
     var xiaozhangjia=new makeDoor(); //小张家须要建门,
     //此处若是没有new ，会出现
     //“JS_singleton.html:46 Uncaught RangeError: Maximum call stack size exceeded”
     //堆栈溢出的错误。
     alert("xiaozhangjia"+xiaozhangjia.create());  //开始产门
</script>

 

 2.与单例模式配合的例子

<meta charset="utf-8"/>
<script type="text/javascript">
     //1.用于建立特定类型的对象
     //2.js开发的时候写单引号

    //声明一个AA公司,造门;将造门放到AA进来，略改一下语法
    var AA={      
     //造门
     function:makeDoor(figure){
         //instanceof 指向当前父类
        if (!(this instanceof makeDoor)) {
                return new makeDoor();
        };
        var _figure = "普通";
        if (figure) {
            _figure= figure;
        };

         this.lock="普通";  //门上的锁
         this.figure=_figure; //门上的花纹
        this.create=function(){   //开始产门
            return  "【锁头】"+this.lock+"【花纹】"+this.figure
        }
    
 }    
     //声明一个BB公司,也能够造门

    var BB={      
     //造门
     function : makeDoor(figure){
         //instanceof 指向当前父类
        if (!(this instanceof makeDoor)) {
                return new makeDoor();
        };
        var _figure = "普通";
        if (figure) {
            _figure= figure;
        };

         this.lock="普通";  //门上的锁
         this.figure=_figure; //门上的花纹
        this.create=function(){   //开始产门
            return  "【锁头】"+this.lock+"【花纹】"+this.figure
        }
    
    }
    var xiaozhangjia=new AA.makeDoor(); //小张家须要建门,
     //此处若是没有new ，会出现
     //“JS_singleton.html:46 Uncaught RangeError: Maximum call stack size exceeded”
     //堆栈溢出的错误。
     alert("xiaozhangjia"+xiaozhangjia.create());  //开始产门

     var xiaolijia =new BB.makeDoor('绚丽');//小李家也须要建门,
     alert("xiaolijia"+xiaolijia.create());
</script>