js学习记录（2）——原型的动态性

原型的动态性

先看一段代码：

function SuperType()
{
	this.name="super";
}
SuperType.prototype.sayName=function(){
	console.log("sayName:"+this.name);
}
function SubType()
{
	this.name="sub";
}
//------------------------------------------------------------------------
var sub1=new SubType();   
SubType.prototype=new SuperType();   
var sub2=new SubType();  
sub1.sayName();
sub2.sayName();

运行上面代码会报错

TypeError: sub1.sayName is not a function

原理见下图：

注：图中并没有画出constructor属性的指向
从分割线处开始分析：
1.此时SubType构造函数的prototype指向的对象是SubType原型
2.

var sub1=new SubType(); 

创建了SubType类型的实例，sub1的原型是SubType原型
3.

SubType.prototype=new SuperType();   

重写SubType构造函数的prototype属性，使其指向SuperType的实例，注意sub1的原型没有跟着改变，仍然是SubType原型
4.

var sub2=new SubType();  

又创建了一个SubType类型的实例sub2，sub2的原型是此时SubType构造函数的prototype属性指向的对象，即SuperType的实例
5.

sub1.sayName();

在sub1实例上调用sayName()方法，先在sub1实例中查找，发现没有，再到sub1的原型即SubType原型中查找，也没有，报错。
6.

//sub1.sayName();

注释掉sub1.sayName()再运行，在控制台输出sayName:sub，过程是现在sub2实例中找，没有，再到sub2的原型即SuperType实例中找，没有，再到SuperType实例的原型中找，找到了。

结论如下：
1.实例的原型是实例创建时其构造函数prototype属性的指向
2.实例的原型不会随其构造函数prototype属性指向的改变而改变