在 JavaScript 中，数组中可以存放不同类型的数据，这种灵活性带来了很多方便。但是，在有些情况下，我们需要对数组的类型进行限制，以保证代码的安全性和健壮性。TypeScript 是一种静态类型语言，它可以提供非常便利的处理数组类型的方法。
1. 数组的类型限制
在 TypeScript 中，我们可以使用数组泛型来明确地声明数组中可以存放哪些数据类型。例如，我们可以声明一个字符串数组：
const arr1: Array<string> = ['foo', 'bar'];
也可以声明一个数字数组：
const arr2: number[] = [1, 2, 3];
这样，当我们尝试往数组中添加不符合类型限制的数据时，TypeScript 就会给出错误提示，从而避免了潜在的错误。
2. 数组中包含不同类型的数据
虽然通常情况下，我们会尽量避免在一个数组中存放不同类型的数据，但是有时候这是必须的。比如，我们找到了一个 API，它返回的数据格式是这样的：
{
"name": "Jane",
"age": 25,
"isStudent": true
}这个 API 返回的是一个对象，但是我们需要把多个这样的对象存放在一个数组中。由于这些对象的类型不同，我们需要用一种类型来表示它们的共性。这时候，我们可以使用联合类型。例如，我们可以声明一个 Person 类型：
-- -------------------- ---- -------
---- ------ - -
----- -------
---- -------
---------- -------
--
----- ---- -------- - -
-
----- -------
---- ---
---------- -----
--
-
----- -------
---- ---
---------- ----
-
--这个数组中的每个元素都是一个 Person 类型的对象。如果我们尝试往数组中添加一个不符合 Person 类型的对象，TypeScript 就会给出错误提示。
3. 处理包含多种类型的数组
有时候，一个数组中既有基本类型，又有对象类型。我们需要对这种数组进行处理，以便能够同时访问数组中的不同类型的数据。例如，我们有这样一个数组：
const arr = [1, 'foo', {name: 'John', age: 23}];我们想要访问这个数组中的每个元素，该怎么做呢？
一种方法是使用类型断言。我们可以使用 as 关键字，将数组中的元素转换为指定类型。例如：
const num: number = arr[0] as number;
const str: string = arr[1] as string;
const obj: {name: string, age: number} = arr[2] as {name: string, age: number};但是这种方法需要手动重复地进行类型断言，代码冗余且不便于维护。
另一种方法是使用类型守卫。我们可以使用 typeof 和 instanceof 运算符，对数组中的元素进行判断。例如：
-- -------------------- ---- ------- -- ------- ------ --- --------- - ----- ---- ------ - ------- - -- ------- ------ --- --------- - ----- ---- ------ - ------- - -- ------- ---------- ------- - ----- ---- ------ ------- ---- ------- - ------ -- ------ ------- ---- -------- -
这种方法不需要显式地进行类型断言，更加简洁和易于维护。
4. 总结
在 TypeScript 中，我们可以使用数组泛型来限制数组中存放的数据类型。当需要存放不同类型的数据时，我们可以使用联合类型来表示它们的共性。当数组中既有基本类型又有对象类型时，我们可以使用类型守卫来访问数组中的不同类型的数据。
TypeScript 提供了非常便利的类型处理工具，可以让我们更加方便地编写安全、健壮的代码。希望这篇文章对你有所帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6476c692968c7c53b036bff8