es6的extends自动设置child.prototype.__proto__指向parent.prototype、修正constructor、支持super()初始化this及继承静态成员和访问器,确保实例可访问父类方法且instanceof校验通过。
用 class 和 extends 实现继承时,javascript 引擎会自动完成原型链的设置,无需手动操作 prototype 或 __proto__。关键在于理解它“自动做了什么”,而不是“怎么手动模拟”。
extends 自动设置原型链指向
当写 class Child extends Parent 时,引擎底层会执行类似以下逻辑:
- 让
Child.prototype.__proto__指向Parent.prototype(即子类原型继承父类原型) - 确保
Child.prototype.constructor === Child(自动修正构造器,避免指向 Parent) - 使
new Child()的实例既能访问Child.prototype上的方法,也能沿原型链找到Parent.prototype上的方法
super() 不仅调用父构造器,还保障 this 初始化
super() 必须在子类 constructor 中**第一行调用**,否则会报错。它的作用不止是执行父类构造逻辑:
- 为子类实例初始化从父类继承来的属性(如
this.name) - 确保
this在调用super()后才可被使用——这是 ES6 继承与 ES5 构造函数调用的本质区别 - 若不调用
super(),this将处于“未初始化”状态,任何访问都会抛出ReferenceError
静态方法和访问器也按规则继承
extends 不只影响实例方法,还统一处理静态成员和 get/set:
- 父类的
static method()会出现在Child类本身上(即Child.method()可直接调用) - 子类静态方法中可用
super.staticMethod()(ES2022+ 支持),本质是沿构造函数的原型链向上查找 -
get/set定义在原型上,因此也会被子类原型自然继承
验证原型链是否建立成功
可通过几个简单检查确认 extends 是否生效:
-
new Child() instanceof Parent→ 返回 true -
Object.getPrototypeOf(Child.prototype) === Parent.prototype→ 返回 true -
Child.prototype.constructor === Child→ 返回 true(不会意外等于 Parent) - 子类实例能直接调用父类原型方法,如
child.sayHello(),无需额外绑定











