TypeScript中扩展Array类的属性无法访问及方法失效问题求助

嘿，我太懂这种深夜熬久了被小问题卡壳的感觉！继承Array的时候踩这个坑真的太常见了——毕竟Array在JS/TS里是个自带特殊机制的家伙，和普通类完全不一样。

JavaScript里的Array对象有一套特殊的内部槽位（比如[[DefineOwnProperty]]），当你直接继承Array并创建实例时，TS编译后的代码往往没法正确把自定义类的原型方法绑定到实例上。有时候你看着初始化成功了，但实例本质上还是个普通Array，自然找不到你的自定义方法。

方案1：修正原型链+正确调用父类构造 #

在自定义类里，除了调用super()，还要手动修正原型链，另外如果需要让filter/map这类原生方法返回你的自定义类实例，还可以加上Symbol.species：

class MyArray<T> extends Array<T> {
  constructor(...args: T[]) {
    super(...args);
    // 手动把实例的原型指向自定义类的原型，修复TS编译的问题
    Object.setPrototypeOf(this, MyArray.prototype);
  }

  // 举个自定义方法的例子
  logLength(): void {
    console.log(`当前数组长度是：${this.length}`);
  }

  // 让原生数组方法返回MyArray实例（可选）
  static get [Symbol.species]() {
    return MyArray;
  }
}

测试一下就正常了：

const myArr = new MyArray(1, 2, 3);
myArr.logLength(); // 正常输出：当前数组长度是：3
const filteredArr = myArr.filter(num => num > 1);
filteredArr.logLength(); // 如果加了Symbol.species，这里也能正常调用

方案2：用组合代替继承（更省心） #

要是不想和Array的特殊机制较劲，直接封装一个Array实例反而更稳妥，完全避开原型链的坑：

class MyArray<T> {
  private innerArray: T[];

  constructor(...args: T[]) {
    this.innerArray = [...args];
  }

  // 封装你需要的原生Array方法，比如push
  push(item: T): number {
    return this.innerArray.push(item);
  }

  // 自定义方法
  logAllItems(): void {
    console.log(`数组内容：${this.innerArray.join(', ')}`);
  }

  // 通过getter获取原生属性，比如length
  get length(): number {
    return this.innerArray.length;
  }
}

这种方式所有方法都是你自己控制的，完全不会有继承带来的奇怪问题。

• 如果你用的是旧版TS，记得在tsconfig.json里开启"downlevelIteration": true，确保迭代器能正常工作；
• 别用[]这种字面量方式初始化你的自定义Array子类，一定要用new关键字，不然实例会是普通Array，根本找不到你的自定义方法。

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