关于Typescript中的类型别名

类型别名

在JavaScript中,我们可以使用变量声明(let、const和var)为值声明别名,那么同样,在Typescript中,我们还可以为类型声明别名,例:

ts 复制代码
type Age = number
type Person = {
    name: string,
    age: Age
}

Age就是一个number,这样可以让Person的结构定义更易于理解,Typescript无法推导类型别名,所以必须显示注解:

ts 复制代码
let age: Age = 18
let xiaoniu: Person = {
    name: 'Mars',
    age: age
}

由于Age是number的别名,所以可以直接给number赋值

ts 复制代码
let age = 18
let xiaoniu: Person = {
    name: 'Mars',
    age: age
}

如上,没有问题

不能重复声明同一类型

我们知道,在JavaScript中,let/const不能两次声明同一个变量,var两次声明同一个变量时,虽然并不会报错,但也只是对值进行了覆盖。那么在Typescript中同一个类型也同样不能声明两次:

ts 复制代码
type Color = 'red'
type Color = 'blue'  // 标识符"Color"重复

此时移动光标可以发现编辑器报出的警告

作用域

在JavaScript中let、const采用的是块级作用域,类似地,类型别名采用的也是块级作用域。每一块代码和每一个函数都有自己的作用域,内部的类型别名将遮盖外部的类型别名:

ts 复制代码
type Color = 'red'
let x = Math.random() < .5
// 和let和const一样,类型别名使用的是块级作用域
if (x) {
    type Color = 'blue'
    let b: Color = 'blue'
    // console.log(x, b)
} else {
    let c: Color = 'red'
    // console.log(x, c)
}

看完上边的例子,相信你已经知道类型别名的作用了:它可以有助于我们减少重复输入复杂类型,还可以更加清楚地表明变量的作用

相关推荐
测试运维日常笔记7 小时前
大模型应用专项测试指南:从 Prompt、RAG 到 Agent 的完整链路
前端·prompt
计算机魔术师7 小时前
没有人告诉他们要这么做——AI 智能体自己学会了"组团"越狱
前端
a努力。8 小时前
LangChain Agent消息链路全解析
java·前端·javascript
今年下半年8 小时前
【前端】ant-design-vue 表格「行、列都动态」的处理方案
前端·javascript·vue.js
szarron9 小时前
VNA6 便携式矢量网络分析仪|1MHz‑6.3GHz 手持 VNA 真实应用场景全解析
前端·嵌入式硬件·信息可视化·数据挖掘·数据分析
Reisentyan9 小时前
B站首页,点击视频卡片之后首页自动刷新的问题
前端
默_笙9 小时前
🚕 缺料就出门买:给 RAG 装上"信息够不够"的判断力
前端·javascript
Liora_Yvonne9 小时前
同样用 Element Plus,为什么你的后台总有一股“模板味”?
前端
葡萄城技术团队9 小时前
用 Sheet 页导航视图管理复杂 SpreadJS 工作簿
前端
志尊宝9 小时前
Vue3 零基础每日笔记(054):Pinia 三件套详解——state / getters / actions 全搞懂
前端·javascript·vue.js·vue·前端开发