1、ES6的class语法与ES5构造函数的相互转换

:::info ES6和ES5之间是相互进行转换的，ES5的代码都可以通过ES6进行重写，ES5中引入了类的概念，让我们在javascript中也可以使用类的语法，ES6中的类本质就是ES5中的构造函数。 :::

1.1 ES5传统类的书写规则

// es5的方法 类的创建 使用构造函数来完成
function Person(name, age) {
    this.name = name;
  this.age = age;
}
// 构造函数实例的方法 一般定义在构造函数的原型对象上
Person.prototype.running = function() {
    console.log(this.name, this.age, "running");
}
// 生成类的实例化对象
const person = new Persion("coderweiwei", 18);
// 读取实例的属性
person.name // "coderweiwei"
person.age // 18
// 执行实例的方法
person.running() // "coderweiwei" 18 "running"
// 注意：当我们访问实例对象的方法的时候，js引擎会先在我们实例对象本身进行寻找，如果找不到则在实例对象的构造函数上的原型上寻找，一直按照原型链的方式向上寻找访问，直到找到原型链的终点null为止。

1.2 使用ES6类语法升级ES5中构造函数的写法

// es6 class 定义类、声明类
class Person {
  constructor(name, age) {
      // 实例对象定义的属性
    this.name = name;
    this.age = age;
  }
    // 实例对象定义的方法 可直接在类里面进行定义
    running() {
      console.log(this.name, this.age, "running")
  }
}
// 生成实例化对象 
// 当我们使用new关键字生成实例化对象的时候 就会主动调用类中的constructor方法
const p1 = new Person("coderweiwei", 13)
p1.name // "coderweiwei"
p1.age // 13
p1.running() // "coderweiwei" 13 "running"

1.3 ES6类的继承

传统面向对象的三大原则

• 封装
• 继承
• 多态

javascript的定位： javascript是一门基于对象的脚本语言，而不是面向对象。
ES6中继承的写法：

// 没有继承的缺点
// 声明一个公共类 声明人这个类
class Person {
  // 构造方法
    constructor(name, age) {
    // 属性
      this.name = name;
    this.age = age;
  }
  // 实例方法
  running() {
      console.log(this.name, this.age, "running")
  }
}
// 声明学生类
class Student {
    constructor(name, age, sno) {
      this.name = name; // 公有的属性
    this.age = age; // 公有的属性
    this.sno = sno;
  }
  running() { // 公有的方法
      console.log("在奔跑")
  }
  learn() {
      console.log("在学习")
  }
}
// 声明教师类
class Teacher {
    constructor(name, age, title) {
      this.name = name; // 公有的属性
    this.age = age; // 公有的属性
    this.title = title;
  }
  running() { // 公有的方法
      console.log("running")
  }
  teach() {
      console.log("teaching")
  }
}
// 上述代码的缺点：
// 1、代码的冗余太大，有太多的重复性代码 person类有name/age属性 我们的student类和teacher类都有相同的属性和方法。那么我们可以从父级中继承一部分公共的属性和方法、减少代码的冗余，针对自己特有的方法再进行声明使用。
// 上述代码的改造
class Student extends Person {
    constructor(name, age, sno){
    // 当我们需要继承父类的部分属性和方法时 需要调用super方法
      super(name, age);
    // 声明实例属性
    this.sno = sno;
  }
  // 声明实例的方法
  learn() {
    console.log("learning")
  }
}
// 教师类
class Teacher extends Person {
    constructor(name, age, title) {
      super(name, age);
    // 声明实例的属性
    this.title = title;
  }
  // 声明实例的方法
  teach() {
      console.log("teach")
  }
}