TypeScript中数组和元祖

TypeScript中数组和元祖

本文我们讨论下TypeScript中数组和元祖，讨论两者之间的区别以及应用场合。

1. 数组

在TypeScript中数组可以存储元素集合，可以同一类型或不同类型。可以通过两种方式定义数组：

type MyArray = string[];

这里定义了单一数据类型。下面定义包括多种类型数组：

type MyArray = Array<string | number>;

类似的通过下面方式定义数组，通过类型推断，效果与上面一致：

const numberArray = [1, 2, 3, 4, 5];

const mixedArray = ['a', 2, 'c'];

这样定义的问题是没法确切知道每个元素的具体类型，无法进一步进行类型检查：

const item = mixedArray[2];

这里item数据类型为string | number，要确定具体类型必须通过typeof进行额外检查。
TypeScript提供了可以定义精确元素类型的方法，下面我们讨论元祖。

2. 元祖

定义元祖的语法如下：

type FixedArray = [string, number, string];

可以给每个元素指定数据类型：

const mixedArray: FixedArray = ['a', 2, 'c'];

const first = mixedArray[0]; // string
const second = mixedArray[1]; // number

但有些奇怪的现象需要解释下。这是一个固定长度数组，显示设定每个元素类型，但我们能够访问固定长度之外的元素吗？我们可以，那其数据类型是什么呢？

const fourth = mixedArray[3]; // string | number

我们居然得到了string | number 数据类型。
好吧，如果我们给范围外的元素设置正确的数据类型，然后再赋值，类型可以确定吗？

mixedArray[3] = 4;
const fourth = mixedArray[3]; // string | number

不，我们可以给范围外的元素赋值，但其仍然是已知数组元素类型的混合类型。

因此使用元祖可以确定元素数据类型，但不要超出范围，可以把元祖理解为固定长度，超出范围不能保证其类型。
JavaScript没有元祖类型，最终只能使用JavaScript数组表示元祖，虽然其可以检查你访问的区域，但不能保证其他模块不改变数组的值。

3. 总结

元祖非常有用，但有点疯狂，基于JavaScript的语言怎能不疯狂。
数组一般用于保存相同类型元素集合，元祖可以存储不同类型元素集合，两者都可以作为函数参数。应用时需了解JavaScript的数组特性。