本文详解将 `class a extends b` 转换为等效函数构造器时的关键陷阱：原型链覆盖导致方法丢失，以及箭函数 `this` 绑定在函数构造器中的行为一致性——实际上箭函数本身无需修改，问题根源在于 `object.create(b.prototype)` 的错误调用时机。
在从 ES6 类迁移到传统函数构造器（function constructor）的过程中，开发者常误以为只需将 class 语法替换为 function 并手动模拟 extends，却忽略了 JavaScript 原型链设置的执行顺序。你提供的代码中，核心故障并非箭函数 () => this.update() 本身——箭函数在函数构造器中完全可用，且其 this 绑定逻辑与类中一致（即继承自调用时的上下文）——真正的问题出在以下两行的位置错误：
A.prototype = Object.create(B.prototype); // ❌ 错误：覆盖了已定义的 init/update/destroy A.prototype.constructor = B;
这两行若写在 A.prototype.init = ... 等赋值语句之后，会直接重置整个 A.prototype 对象，导致先前挂载的所有实例方法（init、update、destroy）全部丢失，变为 undefined。这正是控制台中 test.update 输出 undefined 的根本原因。
✅ 正确做法是：先建立原型继承关系，再向原型添加方法。修正后的完整函数构造器实现如下：
// 假设 B 已正确定义（如 function B(m) { ... }）
function A(m) {
// 显式调用父构造器，等价于 super(m)
B.call(this, m);
}
// ✅ 关键：必须在定义任何方法前设置原型链
A.prototype = Object.create(B.prototype);
A.prototype.constructor = A; // ⚠️ 注意：constructor 应指向 A，而非 B！
// ✅ 此后安全地添加实例方法
A.prototype.init = function() {
// 箭函数仍可正常使用：自动绑定当前实例的 this
this.updateBind = () => {
this.update();
};
window.addEventListener('resizeEnd', this.updateBind);
};
A.prototype.update = function() {
this.scroll?.update(); // 建议增加可选链防护
};
A.prototype.destroy = function() {
window.removeEventListener('resizeEnd', this.updateBind);
this.scroll?.destroy();
};? 重要注意事项：
- A.prototype.constructor 应设为 A（而非 B），否则 new A() instanceof A 可能返回 false，影响类型检测；
- B.call(this, m) 是必需的，用于初始化父类状态（等价于 super(m)）；
- 箭函数 () => this.update() 在函数构造器中行为与类中完全一致：它捕获的是调用 init() 时 this 所指向的实例对象，因此无需改为 bind() 或闭包方案；
- 若 B 使用了 class 定义，确保 B.prototype 包含所有需继承的方法；若 B 也是函数构造器，请确认其原型已正确定义；
- 推荐使用现代工具链（如 Babel + webpack）直接编译类语法，避免手动转换引入维护风险；仅在需兼容极旧环境时采用函数构造器方案。
总结：转换类为函数构造器时，原型链初始化必须前置，箭函数可原样保留——它不是问题源头，而是可靠的 this 绑定方案。抓住这一关键顺序，即可平滑迁移并保持逻辑一致性。
