在 TypeScript 中键入具有联合类型的数组

作者

在 TypeScript 中键入具有联合类型的数组

Type an Array with a Union type in TypeScript

要键入具有联合类型的数组，请使用括号将联合类型括起来，例如const arr: (string | number)[] = ['a', 1, 'b', 2];. 该数组只能包含作为联合类型成员的元素。尝试添加类型不兼容的元素会导致错误。

索引.ts
const arr: (string | number)[] = ['a', 1, 'b', 2];

arr.push('c'); // ✅ OK

// ⛔️ Error: Argument of type 'boolean' is
// not assignable to parameter of type
// 'string | number'.ts(2345)
arr.push(true);

我们声明了一个数组，其中的元素必须符合
联合类型。

联合类型由两种或多种类型组合而成，并表示可以是这些类型中的任何一种的值。

示例中的数组只能包含stringor类型的元素number。

您的联合类型可以根据需要包含任意数量的类型。

索引.ts
const arr: (string | number | boolean)[] = ['a', 1, true];

arr.push('c'); // ✅ OK

// ⛔️ Type 'string[]' is not assignable
// to type 'string'.ts(2345)
arr.push(['a', 'b', 'c']);

使用这种方法时，请确保将联合类型括在括号中，例如
(string | number)[]和 not string | number[]，它们具有不同的含义。

索引.ts
// ⛔️ Error: Type 'string' is not
// assignable to type 'number'.ts(2322)
const arr: string | number[] = ['a', 1];

在上面的示例中，arr变量可以存储一个string或一个数组
numbers。

您也可以将此方法用于类。

索引.ts
class Dog {
  run() {
    console.log('dog runs');
  }
}
class Human {
  walk() {
    console.log('human walks');
  }
}
class Bird {
  fly() {
    console.log('bird flies');
  }
}

// 👇️ array with union type
const arr: (Dog | Human)[] = [];

const d1 = new Dog();
const h1 = new Human();

arr.push(d1); // ✅ OK
arr.push(h1); // ✅  OK

const b1 = new Bird();

// ⛔️ Error: Argument of type 'Bird' is not
// assignable to parameter of type 'Dog | Human'.
arr.push(b1);

我们声明了一个包含Dogor类型元素的数组Human。

我们可以安全地将Dog和Human类的实例添加到数组中，但尝试添加 的实例Bird会导致类型检查器出错。

–

发表评论