js中的继承详解
Posted 考拉的墨尔本
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js中的继承详解相关的知识,希望对你有一定的参考价值。
在js中实现的继承的方法可以有多种,除了原型继承之后,还可以使用借用、伪造构造函数的方法实现继承等等。接下来我们就详细的介绍一下这几种方式。
1.js中的原型继承
关于原型继承的内容其实在上一篇博客中已经介绍过,这里就只说一下它的实现方式,关于其他的内容就不过多重复了。 在js中实现原型继承的方式是借用构造函数的原型和实例来实现: <script type="text/javascript">
function Person(name,age)
this.name=name;
this.age=age;
function Teacher(name,sex)
this.name=name;
this.sex=sex;
Person.prototype.show="kk";
//实现原型继承
Teacher.prototype=new Person();
var t1=new Teacher("aa","男");
//使用Person原型中的属性
console.log(t1.show);
</script>
这种方式就是基于原型实现的继承,但是原型继承有一个很大的缺点,就是没有办法使用上级函数的私有属性逻辑,并且上级函数的私有属性也会进入到下级函数的原型中,从而可能会出现undefined的情况
2.借用、伪造构造函数的方式实现继承
其实这种实现继承的方式是借助call,apply函数来实现的继承,具体如下面的代码: <script type="text/javascript">
function Person(name,age)
this.name=name;
this.age=age;
function Teacher(sex,name,age)
Person.call(this,name,age);
this.sex=sex;
var t1=new Teacher("男","cc",30);
console.log(t1.sex);
console.log(t1.name);
console.log(t1.age);
</script>
这就是使用借用的方式实现的继承,这种方式和原型继承相比可以使用上级函数的私有属性啦,但是不能使用上级函数原型中的属性和方法。
3.总结比较两种继承方法
原型继承:原型继承是通过函数原型和实例的方式实现的继承,可以使用上级函数原型中的内容,但是不能使用上级函数的私有属性逻辑,并且上级函数的私有属性会传递到下级函数的原型,会造成undefined的情况 借用、伪造继承:使用call或者apply函数实现的继承可以使用上级函数的私有属性,但是不能够实现上级函数原型中的内容,并且还可以实现多继承。4.基于这两种方式实现的继承--组合方式继承
<script type="text/javascript">
function Person(name,age)
this.name=name;
this.age=age;
function Teacher(sex,name,age)
Person.call(this,name,age);
this.sex=sex;
Person.prototype.show="kk";
Teacher.prototype=new Person();
var t1=new Teacher("男","cc",30);
console.log(t1.sex);
console.log(t1.name);
console.log(t1.age);
console.log(t1.show);
</script>
将两种实现继承的方式结合在一起,这样的话就具有了上面两种方式共同的优点以上是关于js中的继承详解的主要内容,如果未能解决你的问题,请参考以下文章