js继承总结

前提

继承在js中是有着非常重要的地位的。要实现继承有许多种方式,并且各有各自的优缺点,后者往往都是为了解决前者所存在的问题而诞生的。

实现继承:

实现集成首先需要一个父类,在js中实际上没有“类”这个概念的。在es6中class虽然很像类,但实际上只是es5上的语法糖而已

function Person(nickname){
  //属性
  this.nickname  = nickname || 'Jack'
  //实例方法
  this.phone=function(){
    console.log(this.nickname + '正在打电话')
  }
}
//原型方法
Person.prototype.eat = function(food){
  console.log(this.name + '正在吃:' + food);
}

1、原型链继承

父类的实例作为子类的原型

function Man(){
}
Man.prototype = new Person();
Man.prototype.name = 'Mack';
let ManObj = new Man();

优点:

  • 简单易于实现,父类的新增实例与属性子类都能访问 

缺点 :

  • 可以在子类中增加实例属性,但是如果要新增原型属性和方法需要在new父类构造函数的后面
  • 不能实现多继承
  • 生成新实例的时候,不能向父类构造函数中传参

2、(借用)构造函数继承 

复制父类的实例属性给子类

function Man(nickname){
 //继承了Person
  Person.call(this); //Person.call(this,'tom); 
  this.nickname = nickname || 'Steven'
}
let manObj = new Man();

优点:

  • 解决了子类构造函数向父类构造函数中传递参数

  • 可以实现多继承(claa或者apply多个父类)

 缺点:

  • 方法都在构造函数中,无法复用
  • 不能继承原型属性和方法,只能继承父类的实例属性和方法

3、实例继承

function Man(nickname){
  let instance = new Person();
  instance.nickname = nickname || 'Matin';
  return instance;
}
let manObj = new Man();

 优点:

  • 不限制调用方式
  • 简单,易实现 

缺点: 

  • 不能多次继承 

4、组合式继承 

 调用父类构造函数,继承父类的属性,通过将父类实例作为子类原型,实现函数复用

function Person(name,age){
  this.name = name || 'wangxiao'
  this.age = age || 27
}
Person.prototype.eat = function(){
  return this.name + this.age + 'eat sleep'
}

function Man(name,age){
  Person.call(this,name,age)
}
Man.prototype = new Person();
Man.prototype.constructor = Man;
let manObj = new Man(ren,27);
manObj.eat(); 

优点: 

  • 函数可以复用
  • 不存在引用属性的问题
  • 可以继承属性和方法,并且可以继承圆形的属性和方法 

 

缺点: 

  •  调用了两次父类,产生了两份实例,导致代码臃肿 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值