JS中prototype
本文导读：JavaScript的所有function类型的对象都有一个prototype属性。这个prototype属性本身又是一个object类型的对象，因此我们也可以给这个prototype对象添加任意的属性和方法。既然prototype是对象的“原型”，那么由该函数构造出来的对象应该都会具有这个“原型”的特性。下面简单介绍JS中prototype的用法
javascript中的每个对象都有prototype属性，Javascript中对象的prototype属性的解释是：返回对象类型原型的引用。
一、prototype的定义
你不需要显式地声明一个prototype属性，因为在每一个构造函数中都有它的存在。你可以看看下面的例子：
function Test()
{
}
alert(Test.prototype); // 输出 "Object"
二、给prototype添加属性
prototype是一个对象，因此，你能够给它添加属性。你添加给prototype的属性将会成为使用这个构造函数创建的对象的通用属性。
例如，我下面有一个数据类型Fish，我想让所有的鱼都有这些属性：livesIn="water"和price=20；为了实现这个，我可以给构造函数Fish的prototype添加那些属性。
JScript 代码 复制
function Fish(name, color)
{
this.name=name;
this.color=color;
}
Fish.prototype.livesIn="water";
Fish.prototype.price=20;
var fish1=new Fish("mackarel", "gray");
var fish2=new Fish("goldfish", "orange");
var fish3=new Fish("salmon", "white");
alert(fish1.name+","+fish1.color+","+fish1.livesIn+","+fish1.price);
alert(fish2.name+","+fish2.color+","+fish2.livesIn+","+fish2.price);
alert(fish3.name+","+fish3.color+","+fish3.livesIn+","+fish3.price);
输出结果是：
"mackarel, gray, water, 20"
"goldfish, orange, water, 20"
"salmon, white water, 20"
三、用prototype给对象添加函数
在构造函数的prototype上定义的所有属性和方法，都是可以通过其构造的对象直接访问和调用的。也可以这么说，prototype提供了一群同类对象共享属性和方法的机制。
JScript 代码 复制
function Person(name)
{
this.name = name; //设置对象属性，每个对象各自一份属性数据
};
Person.prototype.SayHello = function() //给Person函数的prototype添加SayHello方法。
{
alert("Hello, I'm " + this.name);
}
var BillGates = new Person("Bill Gates"); //创建BillGates对象
var SteveJobs = new Person("Steve Jobs"); //创建SteveJobs对象
BillGates.SayHello(); //通过BillGates对象直接调用到SayHello方法
SteveJobs.SayHello(); //通过SteveJobs对象直接调用到SayHello方法
alert(BillGates.SayHello == SteveJobs.SayHello); //因为两个对象是共享prototype的SayHello，所以显示：true
四、以下是一些关于类型和对象的例子，大家看完例子后可能更容易理解类型和对象之间的联系
1、可以在类型上使用proptotype来为类型添加行为。这些行为只能在类型的实例上体现
JS中允许的类型有Array, Boolean, Date, Enumerator, Error, Function, Number, Object, RegExp, String
JScript 代码 复制
Object.prototype.Property = 1;
Object.prototype.Method = function ()
{
alert(1);
}
var obj = new Object();
alert(obj.Property);
obj.Method();
2、在实例上不能使用prototype，否则发生编译错误
例如
JScript 代码 复制
var obj = new Object();
obj.prototype.Property = 1; //Error
//Error
obj.prototype.Method = function()
{
alert(1);
}
3、可以为类型定义“静态”的属性和方法，直接在类型上调用即可
JScript 代码 复制
Object.Property = 1;
Object.Method = function()
{
alert(1);
}
alert(Object.Property);
Object.Method();
4、可以在外部使用prototype为自定义的类型添加属性和方法
JScript 代码 复制
function Aclass()
{
this.Property = 1;
this.Method = function()
{
alert(1);
}
}
Aclass.prototype.Property2 = 2;
Aclass.prototype.Method2 = function
{
alert(2);
}
var obj = new Aclass();
alert(obj.Property2);
obj.Method2();
5、在外部不能通过prototype改变自定义类型的属性或方法
该例子可以看到：调用的属性和方法仍是最初定义的结果。
JScript 代码 复制
function Aclass()
{
this.Property = 1;
this.Method = function()
{
alert(1);
}
}
Aclass.prototype.Property = 2;
Aclass.prototype.Method = function
{
alert(2);
}
var obj = new Aclass();
alert(obj.Property);
obj.Method();
6、下面例子说明了一个类型如何从另一个类型继承
JScript 代码 复制
function AClass()
{
this.Property = 1;
this.Method = function()
{
alert(1);
}
}
function AClass2()
{
this.Property2 = 2;
this.Method2 = function()
{
alert(2);
}
}
AClass2.prototype = new AClass();
var obj = new AClass2();
alert(obj.Property);
obj.Method();
alert(obj.Property2);
obj.Method2();
7、下面例子说明了子类如何重写父类的属性或方法
JScript 代码 复制
function AClass()
{
this.Property = 1;
this.Method = function()
{
alert(1);
}
}
function AClass2()
{
this.Property2 = 2;
this.Method2 = function()
{
alert(2);
}
}
AClass2.prototype = new AClass();
AClass2.prototype.Property = 3;
AClass2.prototype.Method = function()
{
alert(4);
}
var obj = new AClass2();
alert(obj.Property);
obj.Method();
登录后方可回帖
