javascript 中的继承机制通过 babel 编译为 es5 代码时，主要依赖 inherits 辅助函数和 _possibleconstructorreturn 来模拟类继承。具体做法是调用 @babel/preset-env 并配置目标环境，babel 会自动将 extends 关键字转换为原型链操作和构造函数调用，确保子类能正确访问父类的属性和方法。
Babel 如何处理 extends 关键字
Babel 在处理 extends 时，会生成一个 _inherits 函数，该函数设置子类的原型为父类的原型，并保留 constructor 属性。同时，它会处理静态方法的继承，将父类的静态方法复制到子类上。对于实例方法，子类可以通过 super 关键字调用父类的方法，Babel 会将其转换为对父类原型的直接调用。
class Parent {
constructor(name) {
this.name = name;
}
greet() {
return `Hello, ${this.name}`;
}
}
class Child extends Parent {
constructor(name, age) {
super(name);
this.age = age;
}
greet() {
return `${super.greet()}, I am ${this.age} years old`;
}
}
上述代码在编译后，Child 的原型会被设置为 Parent.prototype，并且 Child 的构造函数会调用 Parent 的构造函数。当调用 Child 的 greet 方法时，它会先调用 Parent 的 greet 方法，然后添加额外的信息。
super 关键字的编译行为
在子类中，super 关键字用于调用父类的构造函数和方法。Babel 会将 super() 转换为对父类构造函数的调用，并将结果赋值给 this。如果子类没有显式定义构造函数，Babel 会自动生成一个默认的构造函数，其中包含对 super() 的调用。对于方法调用，super.method() 会被转换为对父类原型上对应方法的调用。
class Base {
constructor() {
this.value = 1;
}
getValue() {
return this.value;
}
}
class Derived extends Base {
constructor() {
super();
this.value = 2;
}
getValue() {
return super.getValue() + this.value;
}
}
在上述代码中，Derived 的构造函数调用 super()，这会初始化 this.value 为 1。然后，Derived 将 this.value 设置为 2。当调用 getValue 方法时，它首先调用 Base 的 getValue 方法，返回 1，然后加上 this.value（即 2），最终返回 3。
静态方法继承的具体表现
静态方法是定义在类本身上的方法，而不是类的实例上。Babel 在编译时会确保静态方法从父类正确继承到子类。这意味着子类可以直接调用父类的静态方法，而无需实例化父类。Babel 通过将父类的静态方法复制到子类的构造函数上来实现这一点。
class MathUtils {
static add(a, b) {
return a + b;
}
}
class AdvancedMath extends MathUtils {
static multiply(a, b) {
return a * b;
}
}
在上述代码中，AdvancedMath 继承了 MathUtils 的静态方法 add。因此，可以调用 AdvancedMath.add(1, 2)，这将返回 3。同时，AdvancedMath 也有自己的静态方法 multiply，可以调用 AdvancedMath.multiply(2, 3)，返回 6。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
