本文不讲原理,直接上实例代码
一、基于原型的类继承
1、父类
// 父类构造方法 function Animal(name) { // 属性 this.name = name } // 父类方法 Animal.prototype.echoName = function () { console.log(this.name); }
2、子类
// 子类构造方法 function Dog(name, age) { // 调用父类构造函数 Animal.call(this, name) this.age = age } // 子类继承父类的原型 Dog.prototype = Object.create(Animal.prototype); Dog.prototype.constructor = Dog; // 子类方法 Dog.prototype.sayHello = function () { console.log(this.name, this.age); }
3、实例化
// 实例化父类 var animal = new Animal('Tom') animal.echoName() // 实例化子类 var dog = new Dog('Tom', 23) dog.echoName() dog.sayHello()
二、基于class的类继承
JavaScrip从ES6开始正式引入关键字class
1、父类
class Animal { // 构造方法 constructor(name) { // 属性 this.name = name } // 父类方法 echoName() { console.log(this.name); } }
2、子类
class Dog extends Animal { // 构造方法 constructor(name, age) { // 调用父类构造函数 super(name) this.age = age } sayHello() { console.log(this.name, this.age); } }
3、实例化
// 实例化父类 var animal = new Animal('Tom') animal.echoName() // 实例化子类 var dog = new Dog('Tom', 23) dog.echoName() dog.sayHello()
参考