js基础

开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第19天，点击查看活动详情

上文js基础主要讲解了js中的原型，本文主要讲解如何利用各种方法去实现继承，各有什么优缺点。以及ES6是如何实现继承的。

利用组合继承实现es5里面的继承

js里面要通过组合继承来实现继承

组合继承：

0. 借用构造函数继承
1. 原型继承

步骤：

1.先使用借用构造函数实现属性的继承

function 大分类(){}
function 小分类(){
  大分类构造函数.call(this,大分类所需的参数依次传递);
}

2. 原型继承

小分类构造函数.prototype = new 大分类构造函数();

例如

function Person(name,age,gender){
  this.name = name;
  this.age = age;
  this.gender = gender;
}

Person.prototype.sayName = function(){
  console.log('你好我叫'+this.name);
}

//  1 借用构造函数实现继承
function Student(name,age,gender,number){
  Person.call(this,name,age,gender);
  this.number = number;
}

// 2 原型继承
Student.prototype = new Person();

原型继承图解

ES6里面的class的本质

本质就是一个语法糖——更加简单更加好用的写法了

首先先简单看一下ES6是如何实现类的

根据以上代码，我们可以看到：在这里我们创建了一个类，含有 name 和 dept 两个参数，并且含有一个静态方法 fun 和一个方法 getName。

其实，本质就是es5里面的自定义构造函数来的

那么ES6是如何实现继承的呢？其实是通过extends这个关键字，本质也是通过原型实现继承的

class Manager extends Employee 
{ 
  constructor(name, dept, reports) 
     { 
       super(name, dept) 
        this.reports = reports 
     } 
}  

根据以上代码，我们可以看到：这里我们通过继承父类Employee创建了子类Manager，比父类多一个 reports 的属性，其余全部继承自父类。