js继承例子

作者: 晓李姬
来源: 51数据库
2021-08-25

javascript原型与继承

function Person(){};
var boy = new Person();//错误

当创建函数在改写原型前时，实例的this指针指向的是改写之前的原型，而不是改写后的原型
因此在此处，boy.sayHi()的指针并没有指向改写后的原型
正确做法是先改写原型,再创建实例

Person.prototype={
	constructor:Person,
	name:'Nicolas',
	age:67,
	job:'software Engineer',
	sayHi:function(){
		document.write('hi,'+this.name+'<br>');
	}
}
var boy = new Person();//正确
boy.sayHi();

继承

深入理解，如果再构造一个函数firstWife()，使得她的原型是Person函数的实例，
她的原型的构造函数是她(继承),再创建一个firstWife实例grandson,然后对firstWife
的原型进行重写,包含name属性和sayHi方法。最后调用grandson.sayHi()如下面代码

function firstWife(){};
firstWife.prototype=new Person();//继承
firstWife.prototype.construct=firstWife;//继承
//var grandson=new firstWife();
firstWife.prototype={
	name:'jxg',
	age:22,
	job:'H5 Engineer',
	sayHi:function(){
		document.write('hi,'+this.name);
	}
}
var grandson=new firstWife();
grandson.sayHi();//hi,Nicolas

通过调试，此时grandson.sayHi()返回的是hi,Nicolas,而不是hi,jxg,可以看到
grandson一开始查找自己sayHi()方法，然后从构造函数原型找，此时因为实例创建在
重写firstWife构造函数前,所以firstWife原型this指针指向空，于是继续向上找到
Person的原型的sayHi()方法;因此返回hi,Nicolas

推荐阅读