如何基于ES6基类与混入行为扩展构造函数？

我需要实现一个构造函数混入函数：接收一个类/构造函数，返回带有扩展逻辑的新类。原代码在函数式构造函数中正常运行，但在ES6类中报错TypeError: Class constructor Baseclass cannot be invoked without 'new'。核心需求是把原类的构造函数逻辑应用到扩展类的实例上，而非创建原类的独立实例。

原问题代码 #

混入函数实现 #

function extend_constructor(original, extension) {
  let extended = function (...args) {
    console.log("extended constructor")
    original.prototype.constructor.apply(this, args)
    extension.apply(this, args)
  }
  Object.defineProperty(extended, 'name', Object.getOwnPropertyDescriptor(original, 'name'))
  extended.prototype = Object.create(original.prototype)
  Object.defineProperty(extended.prototype, 'constructor', {
    value: extended,
    writable: true,
    configurable: true
  })
  return extended
}

function extension(id) {
  console.log(`Extension: ${id}`)
}

函数式构造函数测试（正常运行） #

function Basefunc(id) {
  console.log(`Basefunc: ${id}`)
}

new Basefunc(1) // 输出: Basefunc: 1

const BasefuncEx = extend_constructor(Basefunc, extension)
new BasefuncEx(2) // 输出: extended constructor → Basefunc: 2 → Extension: 2

ES6类测试（报错） #

class Baseclass {
  constructor(id) {
    console.log(`Baseclass: ${id}`)
  }
}

new Baseclass(3) // 输出: Baseclass: 3

const BaseclassEx = extend_constructor(Baseclass, extension)
new BaseclassEx(4) // 抛出 TypeError: Class constructor Baseclass cannot be invoked without 'new'

问题根源 #

ES6类的构造函数有严格的调用限制：必须通过new关键字或Reflect.construct调用，不能直接用apply/call绑定this执行。原代码中original.prototype.constructor.apply(this, args)的写法，对函数式构造函数有效，但会触发ES6类的调用检查报错。

解决方案 #

方案1：用Reflect.construct兼容两种构造函数 #

Reflect.construct是标准的构造函数调用方式，同时支持函数式构造函数和ES6类，且能指定构造函数的new.target，保证原型链正确：

function extend_constructor(original, extension) {
  let extended = function (...args) {
    console.log("extended constructor")
    // 调用原构造函数，将逻辑应用到当前实例
    Reflect.construct(original, args, new.target)
    extension.apply(this, args)
  }
  Object.defineProperty(extended, 'name', Object.getOwnPropertyDescriptor(original, 'name'))
  extended.prototype = Object.create(original.prototype)
  Object.defineProperty(extended.prototype, 'constructor', {
    value: extended,
    writable: true,
    configurable: true
  })
  return extended
}

测试ES6类：

const BaseclassEx = extend_constructor(Baseclass, extension)
new BaseclassEx(4)
// 输出顺序：
// extended constructor
// Baseclass: 4
// Extension: 4

方案2：用ES6类语法简化实现 #

直接返回一个继承自原类的新类，利用super关键字调用原构造函数，天然兼容两种构造函数：

function extend_constructor(original, extension) {
  return class extends original {
    constructor(...args) {
      console.log("extended constructor")
      super(...args) // 自动将原构造函数逻辑应用到当前实例
      extension.apply(this, args)
    }
  }
}

这个版本无需手动处理原型链和构造函数属性，代码更简洁，测试结果与方案1一致。

内容的提问来源于stack exchange，提问作者ceving