您所在的位置：网站首页 › 对象数组和数组的区别是什么 › TS

TS

2024-03-01 20:17| 来源: 网络整理| 查看: 265

携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第6天，点击查看活动详情

前言

在翻阅 TypeScript 文档时，一个熟悉又陌生词语跳入眼中：元组。

这个词语明明看过很多次，但就是想不起来他是干嘛的。

今天再次遇到了，就顺手记录下来，免得再忘了。

以下是个人根据文档和各种文章，总结出来的观点，仅代表个人想法，还请各位多多指正。

基本认知

什么是元组？

从 TypeScript 中来看，元组是一个长度固定的、子元素类型不需相同的数组。

可以简单粗暴的理解为，元组是一种特殊的数组。

数组与元组

在 TypeScript 中，定义数组时，无需指定数组的长度，但是，每个数组只能指定一种子元素类型，然后所有的子元素都必须是指定的类型：

// 数组的每一个子元素类型都相同 const arrNumber: number[] = [1,2,3,4,5] const arrString: Array = ['a', 'b', 'c'] // 可以随意更改数组的长度 arrNumber[5] = 6 console.log('arrNumber:', arrNumber) // arrNumber: (6) [1, 2, 3, 4, 5, 6]

但是在定义元组时，可以规定每一个子元素的类型，子元素的类型不必相同，但同时，也是指定了元组的长度：

// 定义元组时，需要指定每一个元素的类型，tuple[0] 是 number，tuple[1] 是 string // 同时，也指定长度为 2 const tuple: [number, boolean] = [12, true] // 此处越界，会报错，但是不会影响执行 tuple[2] = 12 console.log('tuple:', tuple) // tuple: (3) [12, true, 12]

在定义元组时，已经明确规定了长度为 2，所以当给 tuple[2] 赋值时，会出现以下错误：微信截图_20220805162032.png 大意就是元组的长度是 2，所以在索引为 2 的地方不存在任何元素。也就是说，每一次越界访问，都是不被允许的，但实际上却可以访问。

元组的本质仍是数组，所有的数组方法都可以使用。

元组别名

元组另一个区别于数组的地方，就是元组的每一个元素，都可以设定别名。

类似于对象，每一个属性都有自己的名称，但不同的是元组的元素别名，实际上并没有任何实际作用，也不可能通过别名访问:

// tuple[0] 的别名是 age，tuple[1]的别名是 hasPartner const tuple: [age: number, hasPartner: boolean] = [18, false] // 无法通过别名访问到具体的值 console.log('tuple.age:', tuple['age']) // tuple.age: undefined

唯一的用处，就是在编辑器中会弹出提示，提示这个元素代表着什么意思，如下: 微信截图_20220805163913.png

自从元组有了别名之后，我个人觉得有点类似于关系数据库的元组。

关系数据库的元组：元组（tuple）是关系数据库中的基本概念，关系是一张表，表中的每行（即数据库中的每条记录）就是一个元组。

也就是说，在数据库中，每一条数据都是元组，元组是数据的集合，元组中的每一个数据对应表中的某个属性，也就是具有某种含义。

TypeScript 中的元组也是数据的集合，加上别名之后，每个数据，也都被赋予其他的含义：

// tuple[0] 代表年龄 // tuple[1] 代表是否已婚 const tuple: [age: number, hasPartner: boolean] = [18, false]

虽然别名不参与实际的程序运行，但是能让开发者明白，当前数据所拥有的含义。

【本文地址】

公司简介

联系我们