继承方式

原型链继承:

Child()的原型作为Parent()的实例来继承Parent()的方法属性

因为所有实例都继承原型方法属性,其中一个实例对原型属性值更改后,所有实例调用该属性的值全部更改

function Parent() {}  
Parent.prototype.parentSay = function() {  
    return 'i am parent';  
}  
function Child() {}  
Child.prototype.childSay = function() {  
    return 'i am child';  
}  
Child.prototype = new Parent();  
var par = new Parent();  
var kid = new Child();  
  
console.log(kid.parentSay());           //i am parent 

构造函数继承:

在子类的构造函数内部通过call或apply来调用父类构造函数

无法实现函数的复用

function People() {  
    this.name = ['zhangsan','lisi','wangwu'];  
}  
function Person() {  
    People.call(this);  
}  
var per1 = new Person();  
per1.name.push('zhanliu');  
console.log(per1.name);     //["zhangsan", "lisi", "wangwu", "zhanliu"]  
  
var per2 = new Person();  
console.log(per2.name);     //["zhangsan", "lisi", "wangwu"]  

组合继承:

将原型链继承和构造函数继承结合,最常用的继承模式

原型链继承共享的属性和方法,构造函数继承实例属性

function People(num) {  
    this.num = num;  
    this.name = ['zhangsan','lisi','wangwu'];  
}  
People.prototype.numCount = function() {  
    console.log(this.num);  
}  
function Person(num) {  
    People.call(this, num);  
}  
//继承方式  
Person.prototype = new People();  
Person.prototype.constructor = Person;  
  
var per1 = new Person(10);  
per1.name.push('zhaoliu');  
console.log(per1.name);     //["zhangsan", "lisi", "wangwu", "zhanliu"]  
per1.numCount();            //10  
  
var per2 = new Person(20);  
console.log(per2.name);     //["zhangsan", "lisi", "wangwu"]  
per2.numCount();            //20 
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一.原型链### 原型链的基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。每一个构造函数都有一个原...
    Devour_z阅读 1,404评论 0 0
  • 基于这篇文章的一些名称约定: 上面的约定应该是比较合理的,如果难以理解,可以查看黯羽轻扬:JS学习笔记2_面向对象...
    一直玩编程阅读 3,486评论 1 7
  •   有了实体,为了简化定义,自然就有了继承的概念,比如已经定义了一个“人”类,后面需要详细分出“男人”和“女人”,...
    E微客阅读 2,790评论 0 1
  • 这一两周由于工作忙,每天能抽出时间静下心看书学习的时间并不多。李笑来老师的《通往财富自由之路》这个专栏这期进度是学...
    小螃谢阅读 916评论 0 0
  • 旗袍,一朵开在岁月深处的花,也是每个女人的梦。 一个五十三岁的女人,在经历了太多的生死离别后,把自己勇敢地展露在众...
    一米阳光12阅读 3,081评论 0 0