![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
天蓬老师Correction status：qualified
Teacher's comments：es6中的许多东西, 并不是什么新东西, 只是之前开发者的一些约定, 在es6中终于成为标准
Collection
Collection
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>类的继承:原生</title></head><body><script>// 原生是通过修改原型链来实现继承// 1.父类function Vehicle(fuel, purpose) {this.fuel = fuel;this.purpose = purpose;}// 公共/原型方法Vehicle.prototype.show = function () {return `燃料: ${this.fuel}\n用途: ${this.purpose}\n`;};console.dir(Vehicle);// 2. 子类function Car(fuel, purpose, color) {// this是当前子类Vehicle.call(this, fuel, purpose);this.color = color;}// 关键代码// 更新当前子类的原型对象,这样才能实现真正意义上继承Car.prototype = Object.create(Vehicle.prototype);// 手工补上constructorCar.prototype.constructor = Car;// 在子类中重写父类的原型方法Car.prototype.show = function () {return Vehicle.prototype.show.call(this).concat(`颜色: ${this.color}\n`);};// 实例化子类const car = new Car("汽油", "商用", "白色");console.log(car.show());</script></body></html>
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>类的继承：es6</title></head><body><script>// 父类class Vehicle {// 构造方法constructor(fuel, purpose) {this.fuel = fuel;this.purpose = purpose;}// 原型方法show() {return `燃料: ${this.fuel}\n用途: ${this.purpose}\n`;}}// 子类class Car extends Vehicle {constructor(fuel, purpose, color) {// 调用父类的构造方法// super()必须是第一条,否则不能正确的生成子类的thissuper(fuel, purpose);this.color = color;}// 重写父类的原型方法show() {// super:代表父类的原型对象console.log(super.show === Vehicle.prototype.show);return super.show().concat(`颜色: ${this.color}\n`);}// super:// 1. 当成函数: super()代表父类的构造方法,必须用在子类的构造方法中的第一行// 2. 当成对象: super用在原型方法/静态方法,代码父类的原型对象}// 实例化子类const car = new Car("新能源", "商用", "绿色");console.log(car.show());</script></body></html>
es6实现类的继承，用到的super:代表父类的原型对象，调用父类的构造方法时，super()必须是第一条，才能在外部访问到子类天蓬老师