JavaScript新增的两个原始数据类型详解(Record和Tuple)

概述

在ES2021（ES12）中，JavaScript新增了两个原始数据类型：Record（记录）和Tuple（元组）。原始数据类型是指JavaScript内置数据类型，包括number、string、boolean、null、undefined、symbol和BigInt。

Record是一种类似于对象的数据类型，可以在编译时定义数据结构，并保证对象的属性和值类型的安全性。Tuple是一种类似于数组的数据类型，可以在编译时定义数组项的类型和数量，并保证元素的类型和数量的安全性。

这两个数据类型的引入，使得JavaScript代码的类型安全性和代码可读性更高，同时也提高了代码的可维护性和可靠性。

Record

Record是一种类似于对象的数据类型，它由一个键值对组成，键和值都可以有自己的类型。下面是一个Record的定义和初始化的示例：

type Person = Record<string, string | number>;

const person: Person = {
  name: 'Alice',
  age: 30,
  address: 'New York'
};

上面代码中，Person是一个Record类型，它的键是string类型，值可以是string或number类型。通过定义类型，我们可以确保person对象拥有正确的属性和属性值类型。当我们尝试将非法类型的值赋给属性时，TypeScript编译器会提示错误。

下面是一个尝试添加非法属性的例子：

person.age = 'thirty';

// 编译报错：类型“"thirty"”的参数不能赋给类型“number | string”的参数

Record的类型定义可以更复杂，例如可以暂时省略某些属性，比如：

type Person = Record<string, string | number> & {
  postalCode?: string;
};

const person: Person = {
  name: 'Alice',
  age: 30
};

上面代码中，Person类型使用了交叉类型(&)来扩展Record类型，使得postalCode属性变成可选属性。这就允许我们不必在初始化时填写postalCode属性。

Tuple

Tuple（元组）是一种类似于数组的数据类型，与数组不同的是，元组中每个元素都可以有自己的类型。下面是一个元组的定义和初始化的示例：

type Pair = [string, number];

const pair: Pair = ['hello', 123];

上面代码中，Pair是一个类型为[string, number]的元组类型，它代表一个含有两个元素的数组，第一个元素是string类型，第二个元素是number类型。通过类型定义，我们可以确保pair数组中每个元素都符合指定的类型。

当我们尝试将非法类型的元素赋给数组时，TypeScript编译器会提示错误。例如下面的代码：

pair[0] = 123;

// 编译报错：类型“123”的参数不能赋给类型“string”的参数

Tuple的类型定义可以更复杂，例如可以使用可选项和可变元素的形式。比如：

type Pair = [string, number, boolean?, ...string[]];

const pair: Pair = ['hello', 123];
const pair2: Pair = ['hello', 123, true, 'yes', '1'];

上面代码中，Pair类型含有三个元素，第一个元素必须是string类型，第二个元素必须是number类型，第三个元素可选且必须是boolean类型，第四个元素及后面的元素不限数量，且必须是string类型。

结语

通过本文的介绍，我们可以看到，Record和Tuple这两个原理数据类型的引入，使得JavaScript代码类型安全性和可读性更高，同时也提高了代码的可维护性和可靠性。在合适的场景下，可以使用它们来增强代码的健壮性和稳定性。