TypeScript（二）数组和元组

数组

数组对象是使用单独的变量名来存储一系列的值，数组中元素的数据类型都一般是相同的（any[] 类型的数组可以不同）。

数组类型有两种声明方法

第一种声明方法

是直接在基本类型后面加上 []

const arr: string[] = ["rinvay", "beisen", "meituan"];

上面的例子表示数组的 类型是 string[] ，string 表示数组成员类型是 string 类型。成员如果不是 string 类型的时候就会报错。

const arr: string[] = ["rinvay", 18]; // error 不能将类型“number”分配给类型“string”

如果数组成员的类型比较复杂，可以如下的方式定义。

const arr: (string | number)[] = ["rinvay", 18];
// 使用any
const arr1: any[] = ["rinvay", 18, true];

第二种声明方法

是直接使用 ts 内置的 Array 接口 ,这种方法的本质属于范型

const arr: Array<string | number> = ["rivnay", 18];

只读数组

ts 允许声明只读数组，方法是在数组类型前面加上 readonly 关键字。

const arr: readonly number[] = [0, 1, 2];

arr.push(3); // error 类型“readonly number[]”上不存在属性“push”

⚠️readonly 关键字不能与数组的泛型写法一起使用。

const arr: readonly Array<number> = [0, 1, 2]; // error 仅允许对数组和元组字面量类型使用 "readonly" 类型修饰符

ts 提供了两个专门的泛型ReadonlyArray<T>和Readonly<T[]>，用来生成只读数组的类型。

const arr: ReadonlyArray<number> = [0, 1];
const arr1: Readonly<number[]> = [0, 1];

多维数组

ts 使用 T[][] 的方式来声明二维数组, T 表示底层数组成员的类型。

const arr: number[][] = [
  [1, 2],
  [3, 4],
];

元组

数组中元素的数据类型都一般是相同的，如果存储的元素数据类型不同，则需要使用元组，元组中允许存储不同类型的元素，由于成员的类型可以不一样，所以元组必须明确声明每个成员的类型。

声明方法

const tuple: [string, number, boolean] = ["rinvay", 18, true];

元组成员的类型后面可以添加 ?作为后缀，表示成员是可选的。

type Tuple1 = [string, number, boolean];
const tuple1: Tuple1 = ["rinvay", 18]; // error 不能将类型“[string, number]”分配给类型“Tuple1”。源具有 2 个元素，但目标需要 3 个。

type Tuple2 = [string, number, boolean?];
const tuple: Tuple2 = ["rinvay", 18];

使用 ... 拓展运算符，可以声明不限制成员数量的元组

type S1 = [string, ...number[]];

const s1: S1 = ["rinvay", 18, 20];

只读元组

使用 readonly 关键字和 Readonly<T> 工具泛型。

type t1 = readonly [string, number];

type t2 = Readonly<[string, number]>;