掌握TypeScript之数组类型，轻松搞定数据存储！

2023-12-17 05:13:34

TypeScript中的数组类型

数组是一种有序的数据结构，可以存储多个相同类型的数据项。在TypeScript中，数组的类型有多种定义方式，比较灵活。

「类型 + 方括号」表示法

最简单的方法是使用「类型 + 方括号」来表示数组：

// 定义一个字符串数组
let names: string[] = ['John', 'Mary', 'Bob'];

数组的项中不允许出现其他的类型：

// 错误：数组中出现其他类型
let mixedArray: (string | number)[] = ['John', 3, true]; // Error

数组的一项可以是另一个数组：

// 定义一个数组，其中一项是另一个数组
let mixedArray2: (string | number | string[])[] = ['John', 3, ['Alice', 'Bob']];

使用泛型定义数组类型

泛型是一种强大的类型系统，允许您定义通用的类型，而无需指定具体的类型参数。在定义数组类型时，可以使用泛型来表示数组中项的类型：

// 定义一个泛型数组类型
function createArray<T>(items: T[]): T[] {
  return items;
}

// 创建一个字符串数组
let strArray = createArray<string>(['John', 'Mary', 'Bob']);

// 创建一个数字数组
let numArray = createArray<number>([1, 2, 3]);

使用接口定义数组类型

接口是一种用来定义对象的类型的语法结构。也可以使用接口来定义数组的类型：

// 定义一个数组接口
interface IArray<T> {
  [index: number]: T;
  length: number;
}

// 定义一个字符串数组类型
type StringArray = IArray<string>;

// 创建一个字符串数组
let strArray: StringArray = ['John', 'Mary', 'Bob'];

数组的创建和遍历

创建数组

在TypeScript中，可以使用多种方式创建数组：

使用数组字面量：

let names = ['John', 'Mary', 'Bob'];

使用Array构造函数：

let names = new Array('John', 'Mary', 'Bob');

使用Array.from()方法：

let names = Array.from('JohnMaryBob');

遍历数组

可以使用for循环或forEach方法来遍历数组：

// 使用 for 循环遍历数组
for (let i = 0; i < names.length; i++) {
  console.log(names[i]);
}

// 使用 forEach 方法遍历数组
names.forEach((name) => {
  console.log(name);
});