深入理解JavaScript中创建对象模式的演变(原型)

创建对象的模式多种多样,但是各种模式又有怎样的利弊呢?有没有一种最为完美的模式呢?下面我将就以下几个方面来分析创建对象的几种模式:

Object构造函数和对象字面量方法

工厂模式

自定义构造函数模式

原型模式

组合使用自定义构造函数模式和原型模式

动态原型模式、寄生构造函数模式、稳妥构造函数模式

第一部分:Object构造函数和对象字面量方法

  我之前在博文《JavaScript中对象字面量的理解 》中讲到过这两种方法,如何大家不熟悉,可以点进去看一看回顾一下。它们的优点是用来创建单个的对象非常方便。但是这种方法有一个明显的缺点:利用同一接口创建很多对象是,会产生大量的重复代码。这句话怎么理解呢?让我们看一下下面的代码:

1

2

3

4

 

var person1={

    <strong>name</strong>:"zzw",

    <strong>age</strong>:"21",

    <strong>school</strong>:"xjtu",<br>         <strong> sayName</strong>:<strong>function(){</strong><br><strong>                console.log(this.name);</strong><br><strong>                };</strong>

 

 

1

2

3

4

5

 

    }

var person2={

    <strong>name</strong>:"ht",

    <strong>age</strong>:"18",

    <strong>school</strong>:"tjut",<br>         <strong> sayName:function(){</strong><br><strong>            console.log(this.name);</strong><br><strong>          };</strong><br><br>        }

 

   可以看出,当我们创建了两个类似的对象时,我们重复写了name age school 以及对象的方法这些代码,随着类似对象的增多,显然,代码会凸显出复杂、重复的感觉。为解决这一问题,工厂模式应运而生。

第二部分:工厂模式

  刚刚我们提到:为解决创建多个对象产生大量重复代码的问题,由此产生了工厂模式。那么,究竟什么是工厂模式?它是如何解决这一问题的呢?首先,我们可以想一想何谓工厂? 就我个人理解:在工厂可以生产出一个模具,通过这个模具大量生产产品,最终我们可以加以修饰(比如喷涂以不同颜色,包装不同的外壳)。这样就不用一个一个地做产品,由此可以大大地提高效率。

  同样地,对于创建对象也是这样的思路:它会通过一个函数封装创建对象的细节。最后直接将不同的参数传递到这个函数中去,以解决产生大量重复代码的问题。观察以下代码:

1

2

3

4

5

6

7

8

9

10

11

12

13

 

       function createPerson(name,age,school){

    var o=new Object();

    o.name=name;

    o.age=age;

    o.school=school;

    o.sayName=function(){

        console.log(this.name);

    };

    return o;

}

var person1=createPerson("zzw","21","xjtu");

var person2=createPerson("ht","18","tjut");

 

  看似这里的代码也不少啊!可是,如果在多创建2个对象呢,10个呢,100个呢?结果可想而知,于是工厂模式成功地解决了Object构造函数或对象字面量创建单个对象而造成大量代码重复的问题!工厂模式有以下特点:

在函数内部显式地创建了对象。

函数结尾一定要返回这个新创建的对象。

  但是,我们仔细观察,可以发现工厂模式创建的对象,例如这里创建的person1和person2,我们无法直接识别对象是什么类型。为了解决这个问题,自定义的构造函数模式出现了。

第三部分:自定义构造函数模式

  刚刚说到,自定义构造函数模式是为了解决无法直接识别对象的类型才出现的。那么显然自定义构造函数模式至少需要解决两个问题。其一:可以直接识别创建的对象的类型。其二:解决工厂模式解决的创建大量相似对象时产生的代码重复的问题。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/2053e2e6b354a6d70a92c87859b7c2a9.html