主页 / coding / 问题 / 77589806
Accepted
Patrick Kenny
Asked: 2023-12-02 17:36:01 +0800 CST

如何扩展 Array 以强制 TypeScript 中的特定参数？

  • 772

我正在使用 TypeScript，并且想扩展Array以强制执行特定的参数。这样，我可以确保每当创建 FruitArray 时，第一个元素是水果。

所以我尝试Array在课堂上扩展：

class FruitArray extends Array {
  constructor(fruit: FruitsEnum, ...args: string[]) {
    if (!enumContains(FruitsEnum, fruit)) {
      throw new Error('Must initialize with a fruit!');
    }
    super(fruit, ...args);
  }
}

然而，linter 抱怨：

扩展参数必须具有元组类型或传递给剩余参数。

我认为我处理super()错误，但我不明白如何让它发挥作用。

javascript

2 个回答

  1. Best Answer

    首先，我将解决您提出的问题，然后指出一些可能会因扩展方法而困扰您的事情Array。

    关于特定错误，问题似乎是您Array在未指定其元素类型的情况下进行了扩展。出现错误（游乐场）：

    class FruitArray extends Array {
    //                        ^−−−−−− no type parameter here
    // ...
}

    指定元素类型可以使错误消失，例如我在这里给出FruitsEnum | string（playground）：

    class FruitArray extends Array<FruitsEnum | string> {
    // ...
}

    Array不过，像这样扩展会产生一些单独的问题：

    1. 您的代码没有处理它必须处理正确的 subclass 的所有构造签名Array。它至少需要支持这些：

      • 一个数字参数 = 创建一个具有给定长度的空数组
      • 不是数字的单个参数 = 创建一个以该值作为元素的数组
      • 多个参数 = 使用这些元素创建一个数组

      （我认为它不需要支持零参数。在 JavaScript 规范中，当创建数组时，它是通过ArrayCreate和 来实现的ArraySpeciesCreate，两者都需要一个length参数。但是在依赖它之前请仔细检查我。）

      TypeScript 不会抱怨不处理第一个参数为数字（因为Array事后在 JavaScript 上覆盖类型很困难），但fruit参数的值很可能是数字。操场上的例子：

      const f = new FruitArray(FruitsEnum.APPLE, "x");
const f2 = f.slice(1); // <== Calls your constructor with 1 as the only argument

    2. 虽然您可以确保以一个值作为第一个元素FruitArray 开始，但这很快就会变得不真实（ playground）：FruitsEnum

      const f = new FruitArray(FruitsEnum.APPLE, "x");
f[0] = "x";
console.log(JSON.stringify(f));
//                         ^? const f: FruitArray

      仍然f是 a FruitArray，但第一个元素现在是字符串，而不是FruitsEnum。

    您可能最好定义一个元组类型或您自己的不直接扩展的类Array（它可以在其实现中使用数组），但这取决于您要使用它做什么。

    • 4

  2. 为什么需要扩展数组？你不能使用这样的东西吗？

    const fruitArray = new Array<FruitsEnum>()

    对于类的实现：

    为什么水果数组有两种类型？string和FruitsEnum？如果您要强制执行 FruitsEnum 类型，为什么不直接使用 FruitsEnum 呢？

    enum FruitsEnum {

}

class FruitArray extends Array<FruitsEnum> {
  constructor(fruit: FruitsEnum, ...args: FruitsEnum[]) {
    ...
    super(fruit, ...args);
    ...
  }
}
    • 1

相关问题