Class

Class
Class 是 ES6 新增的一个特性，表示“类”。在 ES6 之前，我们是通过构造函数来模拟类。

1、基础语法

class Person {
    // 构造器（构造函数）
    constructor(name, age) {
        // 定义实例对象的属性
        this.name = name;
        this.age = age;
        // ...
    }
    // 定义 Class 的原型的方法
    sayHello() {
        console.log('hello');
    }
}
// 实例对象
const p = new Person('张三', 20);
console.log(p);
// p 实例对象身上没有 sayHello 的方法，调用时会沿着原型链条找到原型身上的方法，然后调用
p.sayHello();

2、constructor
当 class 中不需要定义属性时，constructor 可以省略不写：

class Person {
    sayHello() {
        console.log('hello');
    }
}
const p = new Person('张三', 20);
console.log(p);

当通过 new 调用 class 时，浏览器会对代码进行编译，会自动加上 constructor。

3、实例属性的新写法

class Person {
    name = '张三'
    age = 20
    // 等同于
    // constructor() {
    //     this.name = '张三'
    // }

    sayHello() {
        console.log('hello');
    }
}

const p = new Person();
console.log(p);

4、class 中的 this
在 class 被调用之前，无法确定 this 的指向。当 class 被调用时，class 中的 this 指向的就是 new 出来的实例对象。

class Person {
    name = "张三"
    age = 20
    sayHello() {
        console.log('hello');
        this.introduce();
    }
    introduce() {
        console.log(`我叫${this.name}，今年${this.age}岁`);
    }
}
new Person().sayHello()

在 class 的范围内，我们可以通过 this 去访问 class 内部所有的属性和方法。

5、静态属性和静态方法
静态属性和静态方法，指的是 class 身上的属性和方法。

class Person {
    // 静态属性
    static type = "中国人"
    // 静态方法
    static sayHello() {
        console.log('hello');
    }
}

const p = new Person();
// p.sayHello();
Person.sayHello();
// Person.type = "中国人"

// Math.random();
// new Promise(() => {}).then()
// Promise.reject();

6、继承

可以让一个 class 作为子类，去继承另一个 class（父类）内部所有的属性和方法。

class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
    sayHello() {
        console.log('hello');
    }
}

class Student extends Person {
    // 接收调用时外部传递的数据
    constructor(name, age) {
        // 将数据传递给父类
        super(name, age);
    }
}

const s = new Student('李明', 18);
console.log(s);
子类的 constructor
在继承时，子类的 constructor 连同内部的 super 都可以省略不写。

class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
    sayHello() {
        console.log('hello');
    }
}

class Student extends Person {

}

const s = new Student('李明', 18);
console.log(s);
但是，最后在代码编译时，还是会自动添加并执行 constructor 和 super 方法。

子类属性和方法的重写
子类在继承了父类的属性和方法后，还是可以继续定义自己的属性和方法。如果子类自己的属性和方法与父类的重名了，那么在使用时优先使用子类自己的属性和方法。

class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
    sayHello() {
        console.log('hello');
    }
}

class Student extends Person {
    gender = '男'
    sayHello() {
        console.log('你好');
    }
}

const s = new Student('李明', 18);
s.sayHello();