彻底弄懂js中的三种继承方式:类式继承,拷贝继承和原型继承

原创 sean5120scan 教程 javascript 455阅读 2017-08-25 15:11:08 举报

1类式继承:所谓类式继承,就是通过父类创建一个类的实例,把子类的原型链通过等于这个类的实例的方式指向父类,从而子类就具有了属性和方法。实现继承
function Person(name,age){
this.name=name;
this.age=age
}
var p=new Person(); //所谓类式继承,就是通过父类创建一个类的实例,把子类的原型链等于这个类的实例,实现继承

function Student(name,age,className){
Person.call(this,name,age)
this.className="two"
}

Student.prototype=p;
var s1=new Student("sean",20);
s1.eat()
但是,直接通过Student.prototype=p;是有问题的,对象是引用类型。它的赋值是会修改之前的对象,也就是说我们给Student的prototype添加或者修改方法。会使父级也相应添加或删除某些方法。那有没有解决的办法呢?当然。js的每个构造函数都有一个prototype属性,在prototype之下,都有不可枚举的属性constructor,constructor属性的值是一个函数对象,而且函数指向的正式构造函数(即创建该对象的那个函数),所以可以这样判断某个对象是否是某个构造函数的实例。那么我们只需要做这样的修改Student.constructor=Student。就可以了

2 原型继承
所谓原型继承:其实和类式继承很相识。只不过类式继承是通过把一个父对象的实例等于子类的原型prototype属性来实现,而 原型继承则是通过一个空函数来实现,也就是把父类的原型赋值给空函数,再把该空函数返回的一个实例对象等于子类的原型prototype属性
function Person(name,age){
this.name=name;
this.age=age
}

Person.prototype.eat=function(){
console.log("eat")
}

function Student(name,age,className){
Person.call(this,name,age)
this.className="two"
}

function fn(){}
fn.prototype=Person.prototype;
Student.prototype=new fn();

var s1=new Student("sean",20);
s1.eat()

3 拷贝继承
拷贝继承很好理解。我们把父类的属性和方法通过拷贝的方式给子类即可
拷贝继承:1?继承哪些东西?
继承的是父类的属性和方法
属性如何继承? ----通过call,对象冒充的方式
方法如何继承? ----通过拷贝的方式,把父类的原型上的方法通过拷贝的方式复制到子类中,这样子类就具有了父类的所有方法
</body>
</html>
<script >

function Person(name,age){
this.name=name;
this.age=age;
}
Person.prototype.eat=function(){
console.log("eat")
}

function Student(name,age,className){
Person.call(this,age,name)
this.className=className
}

for(var attr in Person.prototype){
Student.prototype[attr]=Person.prototype[attr]
}

var s1=new Student();
console.log(s1.constructor)
s1.eat();

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复