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

创建自定义类型最常见的就是组合使用构造函数模式和原型模式。构造函数模式用于定义实例的属性。而原型模式我们上节了解到,主要是用于定义公用的属性和方法。
首先看一下构造函数模式创建js对象.

1. 构造函数模式
构造函数模式可以用来创建特定类型的对象

function Person(name, age, job){
    this.name = name;
    this.age = age;
    this.job = job;
    this.sayName= function(){
         alert(this.name)
    };
}

var person1 = new Person("zhangsan", 29, "Software Enginner");
var person1 = new Person("lisi", 31, "Doctor");

即要创建Person新实例,必须使用new操作符。person1和person2分别保存着Person的一个不同的实例,这两个对象都有constructor属性,且都指向Person。

alert(person1.constructor == Person); //true;
alert(person2.constructor == Person); //true;

两个实例相当于都有了构造函数的一个副本,在一个实例中修改属性或者方法,不会影响到另一个实例中的属性和方法。
如:

function Person(name, age, job){
    this.name = name;
    this.age = age;
    this.job = job;
    this.sayName= function(){
         return (this.name)
    };
}

var person1 = new Person("zhangsan", 29, "Software Enginner");
var person2 = new Person("lisi", 31, "Doctor");

person1.name = "wangwu";
alert(person1.sayName());//wangwu

alert(person2.sayName());//lisi
}

所以说构造函数主要用来定义实例特有的属性和方法。而原型模式上节讲过用来定义共享的属性和方法。如果将两者结合起来,就会使实例具有自己特有的属性和方法,又有共享的属性和方法。于是就出现了,

2. 组合使用构造函数和原型模式

function Person(name, age, job){
    this.name = name;
    this.age = age;
    this.job = job;
    this.friends = ['aa', 'bb'];
}
Person.prototype = {
    constructor:Person,
    SayName : function(){
        alert(this.name);
    }
}

    var person1 = new Person("zhangsan", 29, "Software Enginner");
var person2 = new Person("lisi", 31, "Doctor");


person1.friends.push('cc');
alert(person1.friends);    //aa, bb, cc
alert(person2.friends);    // aa, bb
alert(person1.friends === person2.friends);    //false
alert(person1.sayName === person2.sayName);  //true

实例中的属性都是在构造函数中定义的。由实例所共享的属性constructor和方法则是在原型对象中定义的。修改了person1中的friends方法并不会影响person2中的方法。这也是构造函数的特性。

这种构造函数与原型模式混成的模式,目前在ECMAScript中使用最广泛,认同度最高的一种创建自定义类型的方法,可以说这是用来定义引用类型的一种默认模式。

3. 动态原型模式
在上面介绍了构造函数模式与组合使用构造函数模式和原型模式之后,又引入了动态原型模式。

动态原型模式将所有信息都封装在了构造函数中,而通过在构造函数中初始化原型(如果有必要的话),又保持了同时使用构造函数与原型的优点。

function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;

if(typeof this.sayName != "function"){
    Person.prototype.sayName = function(){
        alert (this.name);
    }
}

这样只有在sayName方法不存在的情况下,才会将它添加到原型中。这里对原型所做的修改,会立即在实例中反映出来。

注意:使用动态原型模式时,不能使用对象字面量来重写原型。这样会切断所有实例与新原型之间的联系。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值