前情提要:
JavaScript 语言中，在使用类之前，生成实例对象的传统方法是通过使用构造函数。
一、构造函数：
定义：通过 new 函数名 来实例化对象的函数叫构造函数。
主要功能：为初始化对象，特点是和new 一起使用。new就是在创建对象，从无到有，构造函数就是在为初始化的对象添加属性和方法。
注意：任何的函数都可以作为构造函数存在，构造函数定义时首字母大写（规范）。
对new的理解：new 申请内存, 创建对象,当调用new时，后台会隐式执行new Object()创建对象。所以，通过new创建的字符串、数字是引用类型，而是非值类型。
1、原生构造函数的继承
原生构造函数是指语言内置的构造函数，通常用来生成数据结构。
大致有：
Boolean()
Number()
String()
Array()
Date()
Function()
RegExp()
Error()
Object()
在之前，这些原生构造函数是无法继承的，比如，不能自己定义一个Array的子类。
例子:
function MyArray() {
Array.apply(this, arguments);
}
MyArray.prototype = Object.create(Array.prototype, {
constructor: {
value: MyArray,
writable: true,
configurable: true,
enumerable: true
}
});
var colors = new MyArray();
colors[0] = "red";
colors.length // 0
colors.length = 0;
colors[0] // "red"
之所以会发生这种情况，是因为子类无法获得原生构造函数的内部属性，通过Array.apply()或者分配给原型对象都不行。
这就说明了原生构造函数的this无法绑定，导致拿不到内部属性。
2、执行一个构造函数：
function A(name,age){ this.name = name; this.age = age; }
A.prototype.info = function(){
return "姓名"+ "" + this.name + "年龄" + this.age
}
let a = new A("张三",22)//实例化a
//打印 a结果
A{
name:"张三",
age:22
}
//打印 a.info() 结果为 "姓名张三年龄22"
二、class 类
由来：因为上面构造函数的写法跟传统的面向对象语言差异很大，给很多程序员造成很多困惑，所以ES6 提供了更接近传统语言的写法，引入了 Class（类）这个概念，作为对象的模板。
通过class关键字，可以定义类。
1、class类基本语法的使用
class A{
constructor(){
//成员属性
this.name = name
this.age = age
}
//静态方法 如果在一个方法前，加上static关键字，就表示该方法不会被实例继承，而是直接通过类来调用，这就称为“静态方法”。A.nihao()
static nihao(){
console.log("你好")
}
//成员方法
info(){
return "姓名"+ "" + this.name + "年龄" + this.age
}
}
与上面的构造函数相比之言，新的class写法让对象原型的写法更加清晰、更像面向对象编程的语法。
注意：定义info()方法的时候，前面不需要加上function这个关键字，直接把函数定义放进去了就可以了，方法与方法之间不需要逗号分隔，加了会报错。
添加静态属性：静态属性指的是 Class 本身的属性，即Class.propName，而不是定义在实例对象（this）上的属性。
**老式写法：**
class A{}
A.props=1 //A.props= 1 props就是A的静态属性
**新式写法：**
class A{
static props = 1
}
新写法是显式声明（declarative），而不是赋值处理，语义更好。
**私有方法和私有属性：**
私有方法两种写法：
function bar(name){
return this.name = name
}
class A{
foo(name){
bar.call(this,name)
}
}
这样写的原因是类内部的所有方法都是对外可见的。foo是公开方法，内部调用了bar.call(this, baz)。这使得bar()实际上成为了当前类的私有方法。
**还有一种方法是利用Symbol值的唯一性，将私有方法的名字命名为一个Symbol值。**
const bar = Symbol('bar')
const name = Symbol('name')
class A{
//公有方法
foo(){
this[bra](name)
}
//私有方法
[bar](name){
return this[name] = name
}
}
**私有属性**
第一种方法是在属性名之前，使用#表示。
class A{
#count = 0
}
注意：#count就是私有属性，只能在类的内部使用（this.#count）。如果在类的外部使用，就会报错。
这种写法不仅可以写私有属性，还可以用来写私有方法。
私有属性也可以设置 getter 和 setter 方法。
class Foo {
#a;
#b;
#xVal = 0; constructor(a, b) { this.#a = a; this.#b = b; } #sum() { return this.#a + this.#b; } printSum() { console.log(this.#sum()); }
get #x() { return #xValue; }
set #x(value) {
this.#xValue = value;
}
}
私有属性不限于从this引用，只要是在类的内部，实例也可以引用私有属性。
私有属性和私有方法前面，也可以加上static关键字，表示这是一个静态的私有属性或私有方法。
```
### 2、深入介绍class类
```
<1>
ES6 的类，完全可以看作构造函数的另一种写法。
class A{} typeof A //function A === A.prototype.constructor // ture 可以看出，类的数据类型就是函数，类本身就指向构造函数。
使用的时候，也是直接对类使用new命令，跟构造函数的用法完全一致。
<2>
class A{
constructor(){}
info(){}
toString(){}
toVal(){}
}
等同于
A.prototype={
info(){},
toString(){},
toVal(){},
};
构造函数的prototype属性，在类里面也存在，类的所有方法都定义在类的prototype属性上面.
因此，在类的实例上面调用方法，其实就是调用原型上的方法。
<3>
Object.assign() 方法可以很方便地一次向类添加多个方法。如下：
Object.assign(A.prototype,{
toString(){},
toVal(){},
})
<4>
类的内部所有定义的方法，都是不可枚举的，如下：
class A{ constructor(x, y) { // ... } toString() { // ... } } Object.keys(A.prototype) // []
<5>
类内部可以忽略不写constructor，因为JavaScript 引擎会自动为它添加一个空的constructor()方法。如下：
class A{} === class A{constructor(){}} //true
<6>
constructor()方法默认返回实例对象（即this），完全可以指定返回另外一个对象。
<7>
类必须使用new调用，否则会报错。这是它跟普通构造函数的一个主要区别，后者不用new也可以执行。
三、class继承
1、extends 关键字
class 通过extends关键字实现继承，如下代码：
class A{
constructor(){
this.p = 1
}
static hello(){
console.log("Hello World")
}
p(){
return 2
}
getP(){
console.log(this.p);
}
}
A.prototype.num = 2
class B extends A{
constructor(){
super() //关键字，super作为函数调用时，代表父类的构造函数
this.p = 2
super.p = 3
console.log(super.num) //2
console.log(super.p()) //2
console.log(super.p) //undefined
console.log(this.p) //3
//super.p赋值为3，这时等同于对this.p赋值为3。而当读取super.p的时候，读的是A.prototype.p，所以返回undefined。
}
get n(){
return super.p
}
m(){
super.getP()
//super()写在这里报错
}
} //B类继承了A类的所有属性和方法
let b = new B() //实列化
B.hello() //Hello World //这就反映出，父类的静态方法，也会被子类继承。
b.n //undefined
b.m() //2 这说明实际上执行的是super.getP.call(this)。
优点：这样的继承方式非常清晰和方便
实质：先将父类实例对象的属性和方法，加到this上面（所以必须先调用super方法），然后再用子类的构造函数修改this。
注意：
<1><span style="color:red;">构造函数如果没有调用super方法，就会导致新建实例时报错。</span>
<2><span style="color:green;">在子类A的构造函数中，只有调用super之后，才可以使用this关键字，否则会报错。这是因为子类实例的构建，基于父类实例，只有super方法才能调用父类实例。</span>
2、Object.getPrototypeof()
作用：从子类上获取父类.
例子:
Object.getPrototypeOf(B) === A
//true
因此从上面的例子看出，可以使用这个方法判断，一个类是否继承了另一个类。
3、super 关键字
作用：可以当作函数使用，也可以当作对象使用
注意：<span style="color:red;">在这两种不同的情况下，它的用法也完全不相同。</span>
第一种情况
super作为函数调用时，代表父类的构造函数。
ES6 要求，子类的构造函数必须执行一次super函数
注意:
<span style="color:red;">super虽然代表了父类A的构造函数，但是返回的是子类B的实例，即super内部的this指的是B的实例，因此super()在这里相当于A.prototype.constructor.call(this)。</span>
<span style="color:red;">作为函数时，super()只能用在子类的构造函数之中，用在其他地方就会报错。</span>
代码可以看上面对extends的介绍**
第二种情况
super作为对象时，在普通方法中，指向父类的原型对象；在静态方法中，指向父类。
普通方法中
子类B当中的super.p()，就是将super当作一个对象使用。
super在普通方法之中，指向A.prototype，所以super.p()就相当于A.prototype.p()。
因为由于super指向父类的原型对象，所以定义在父类的原型对象上，super是可以取到。
注意：<span style="color:red;">定义在父类实例上的方法或属性，是无法通过super调用的。</span>
在子类普通方法中通过super调用父类的方法时，方法内部的this指向当前的子类实例。
代码可以看上面对extends的介绍
静态方法中
class Parent {
static myMethod(msg) {
console.log('static', msg);
}
myMethod(msg) {
console.log('instance', msg);
}
}
class Child extends Parent {
static myMethod(msg) {
super.myMethod(msg);
}
myMethod(msg) {
super.myMethod(msg);
}
}
Child.myMethod(1); // static 1
var child = new Child();
child.myMethod(2); // instance 2
super在静态方法之中指向父类，在普通方法之中指向父类的原型对象。
在子类的静态方法中通过super调用父类的方法时，方法内部的this指向当前的子类，而不是子类的实例。
注意：<span style="color:red;">我们使用super时，一定要表明他的使用类型是作为函数使用还是作为对象使用，不能直接打印super会报错</span>
最后，由于对象总是继承其他对象的，所以可以在任意一个对象中，使用super关键字。
4、类的prototype属性和__proto__属性
Class 作为构造函数的语法糖，同时有prototype属性和__proto__属性，因此同时存在两条继承链。
接下来上代码解释：
class A {
}
class B extends A {
}
B.__proto__ === A // true
B.prototype.__proto__ === A.prototype // true
//由此看出，子类的__proto__属性，表示构造函数的继承，总是指向父类;
//子类prototype属性的__proto__属性，表示方法的继承，总是指向父类的prototype属性。
// B 的实例继承 A 的实例
Object.setPrototypeOf(B.prototype, A.prototype);
// 等同于
B.prototype.__proto__ = A.prototype;
// B 继承 A 的静态属性
Object.setPrototypeOf(B, A);
// 等同于
B.__proto__ = A;
const b = new B();
这两条继承链，可以这样理解：**作为一个对象，子类（B）的原型（__proto__属性）是父类（A）；作为一个构造函数，子类（B）的原型对象（prototype属性）是父类的原型对象（prototype属性）的实例。**
实例的__proto__属性
子类实例的__proto__属性的__proto__属性，指向父类实例的__proto__属性。也就是说，子类的原型的原型，是父类的原型。
const a1 = new A()
const a2 = new B()
a2.__proto__.__proto__ = a1.__proto__ //true
因为B继承了A,所以说B的原型的原型是A的原型
因此，通过子类实例的__proto__.__proto__属性，可以修改父类实例的行为。
a2.__proto__.__proto__.name = function(){
console.log("张三")
}
a1.name()//"张三"
上面代码在B的实例a2上向A类添加方法，结果影响到了A的实例a1。