c语言 prototype_剖析JavaScript中的原型(Prototype)

本文深入探讨JavaScript中的原型和继承概念。通过示例解释了构造函数、原型对象之间的关系以及如何通过原型实现对象的共享属性和方法。介绍了原型链的工作原理,并展示了如何通过`inheritPrototype`函数实现继承。强调了理解原型对于掌握JavaScript中的面向对象编程至关重要,同时也为理解其他设计模式奠定了基础。
摘要由CSDN通过智能技术生成

转载请注明出处:http://blog.csdn.net/horkychen

上篇提到构造函数包含一个prototype是实现继承的关键,就是原型链的概念。在JavaScript中当使用构造函数创建一个对象时,如下面的图示(来自<>):

JavaScript为建构函数生成一个原型(Prototype)指向原型对象,包含了所有实例共享的对象。而原型中也有一个constructor指向建构函数,以起到标识的作用,说明”我是谁”.建构函数本身也是一个普通函数,只是首字母大写了。

当通过访问实例的属性和方法时:

a.如果实例定义了同名的属性或方法,使用之。

b.否则,尝试调用原型的同名属性或方法。

这里有一个关键的准则:

所有在建构函数中定义的属性和方法,各个实例各自拥有一份。

所有在原型中定义的引用类型属性(基本类型除外)和方法,各个实例将共享使用。

下面是一个包含建构和原型两种方式的对象创建示例:

function Person(name)

{

this.name = name;

}

Person.prototype =

{

friends:["A","B"],

introduceSelf : function()

{

document.write("

document.write("

}

};

var horky = new Person("Horky");

horky.friends.push("C");

var arthas = new Person("Arthas");

horky.introduceSelf(); //My friends are A,B,C

arthas.introduceSelf(); //My friends are A,B,C

输出的结果是:

My name is Horky

My friends are A,B,C

My name is Arthas

My friends are A,B,C

认识这个特性很重要。一般我们希望类的方法可以重用,而不是各个实例再拥有一份实现,就可以放到原型的定义里面去。而对于子类需要自己定义的属性就可以放到建构函数中去。

既然原型也是一个对象,就可以按需要修改,比如扩展一下类的功能,随时加一个定义就可以了。

在上面代码后加入类似下面的代码:

……

horky.introduceSelf(); //My friends are A,B,C

arthas.introduceSelf(); //My friends are A,B,C

Person.prototype.saySomething = function(text)

{

document.write("

}

horky.saySomething("Hello, everyone!");

输出结果就会多一行:

Horky says:Hello, everyone!

理解了原型,我们再看一下继承。继承的要素是继承父类的属性和方法定义,而且属性可以自行更改。本身实例和原型之间就是继承关系的影子,因为访问是从下至上的。所以继承无非是要将子类的prototype变成一个指向父类原型的对象就可以了,如下图:

这就是<>中所讲的较常用的寄生组合式继承。寄生指的是调用建构函数,组合则指的原型的运用。下面是示例代码:

function inheritPrototype(subType,superType){

var prototype=object(superType.prototype);  //创建对象

prototype.constructor=subType;                       //增强对象

subType.prototype=prototype;                          //指定对象

}

function SuperType(name){

this.name=name;

this.color=["red","blue","greed"];

}

SuperType.prototype.sayName=function(){

alert(this.name);

}

function SubType(name,age){

SuperType.call(this,name); //呼叫父类的建构函数

this.age=age;

}

inheritPrototype(SubType,SuperType); //将子类设定为继承自父类

SubType.prototype.sayAge=function(){ //增加一个子类方法

alert(this.age);

};

只要掌握前面所提原型的概念,JavaScript中使用很多OO的实现就很好理解了。比如所谓的模块(单件)模式之类的。

*<>第3版在这段代码下(P173)附的图6-6是属于前段代码的解释,放在这段代码下实在容易让人误解。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值