打字稿:使用数组表示法从 class 中获取项目

Typescript: Using array notation to get items from class

我有 class 叫 Candles 和一个 class 叫 CandleCandles 有一个 属性 list,其中包含 Candle.

的数组
class Candles
{
  public list: Array<Candle>;
}

class Candle
{
  public date: number;
  public high: number;
  public low: number;
  public open: number;
  public close: number;
  public volume: number;
}

我想listCandlesclass封装。例如,

const candles = new Candles();
candles[3] === candles.list[3];

我想要candles[3]到returncandles.list[3]

我也想用地图。示例:

candles.map(function(candle: Candle) {
    console.log(candle.high);
});

你想要的是运算符重载。 Typescript 不支持它。

您可以在 github 问题线程中了解更多关于这种情况的原因: https://github.com/Microsoft/TypeScript/issues/2319 https://github.com/Microsoft/TypeScript/issues/5407

您无法更改 Typescript 中索引操作的行为,因为 Javascript 也不支持此操作。您可以做的是创建一个扩展标准数组的类型,如 question

中所述

您可以使用 ES6 拦截和转发对内部列表的调用 Proxy:

class Candles {
  public list: Candle[] = [];

  constructor() {
    return new Proxy(this, {
      get(target, propertyKey) {
        console.log('getting ', propertyKey);
        if (propertyKey in target) {
          console.log('own property');
          return target[propertyKey]
        }

        console.log('forward to inner list');
        const property = target.list[propertyKey];
        if (typeof property === "function") {
          return property.bind(target.list);
        }

        return property;
      }
    });
  }
}

要通知编译器 Candles 可以用作 Array 添加以下定义:

interface Candles extends Array<Candle> { }

现在所有数组好东西(例如 pushforeachmap...)都可以应用于 Candles:

const candles = new Candles();
candles.push({ low: 1 } as Candle);

console.log(candles[0] === candles.list[0]); //true
candles.forEach(c => console.log(c));

Demo 在操场上。

这是我所做的:

class Candles extends Array<Candle>
{
  constructor(candles: Array<Candle.Data>) {
    super(...candles.map((candle) => new Candle(candle as Candle.Data)));
    Object.setPrototypeOf(Candles, Object.assign(Array.prototype, Candles.prototype));
  }
}

我去掉了 list,只是扩展了 Array<Candle>。我还添加了 Object.setPrototypeOf(Candles, Object.assign(Array.prototype, Candles.prototype)); 以使用 Array 方法以及 Candles 的方法