TypeScript 的数组类型

JavaScript 数组在 TypeScript 里面分成两种类型，分别是数组（array）和元组（tuple）。

简介

TypeScript 数组有一个根本特征：所有成员的类型必须相同，

let arr:(number|string)[];

let arr:Array<number> = [1, 2, 3];

TypeScript 允许使用方括号读取数组成员的类型。

type Names = string[];
type Name = Names[0]; // string

由于数组成员的索引类型都是number，所以读取成员类型也可以写成下面这样。

type Names = string[];
type Name = Names[number]; // string

数组的类型推断

TypeScript 提供了两个专门的泛型，用来生成只读数组的类型。

const a1:ReadonlyArray<number> = [0, 1];

const a2:Readonly<number[]> = [0, 1];

类型推断的自动更新只发生初始值为空数组的情况。

只读数组，readonly

只读数组是数组的父类型，所以它不能代替数组。

let a1:number[] = [0, 1];
let a2:readonly number[] = a1; // 正确

a1 = a2; // 报错

只读数组还有一种声明方法，就是使用“const 断言”。

多维数组

var multi:number[][] =
  [[1,2,3], [23,24,25]];

TypeScript 的元组类型

表示成员类型可以自由设置的数组，即数组的各个成员的类型可以不同。 简介 使用扩展运算符（...），可以表示不限成员数量的元组。

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

const a:NamedNums = ['A', 1, 2];
const b:NamedNums = ['B', 1, 2, 3];

元组可以通过方括号，读取成员类型。

type Tuple = [string, number];
type Age = Tuple[1]; // number

只读元组

// 写法一
type t = readonly [number, string]

// 写法二
type t = Readonly<[number, string]>

由于只读元组不能替代元组

function distanceFromOrigin([x, y]:[number, number]) {
  return Math.sqrt(x**2 + y**2);
}

let point = [3, 4] as const;

distanceFromOrigin(point); // 报错