深入理解TS（5）—— 字面量类型

最新推荐文章于 2025-07-11 13:05:47 发布

weixin_41387874

最新推荐文章于 2025-07-11 13:05:47 发布

阅读量1.4k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： typescript 文章标签： typescript

本文链接：https://blog.csdn.net/weixin_41387874/article/details/123675748

typescript 专栏收录该内容

11 篇文章

订阅专栏

本文深入探讨了TypeScript中的字面量类型，包括字符串字面量、boolean字面量和number字面量。通过示例说明如何使用字面量类型，并解决了在使用过程中可能出现的类型不匹配问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

字面量类型

TS支持将一个字面量当成一个类型使用。

let foo: ‘Hello’;
foo变量的类型是 ‘Hello’，它只能兼容字面量值为 ‘Hello’ 的变量，也只能接受 ‘Hello’ 作为赋值数据。
```
let foo: 'Hello';
foo = 'Hello'
foo = 'a' //不能将'a'分配给'Hello'类型
```

TS提供3种字面量类型

字符串字面量类型

字符串字面量类型就是使用字符串字面量作为类型。

实际上单个的字符串字面量类型并不是很有用，但是可以使用联合类型将多个字符串字面量组合成一个类型（形成类似于字符串枚举的作用）。

type CardinalDirection = 'North' | 'East' | 'South' | 'West';

function move(distance: number, direction: CardinalDirection)
{

}

move(1,'North')

enum States{
    North = 'north',
    East = 'east',
    South = 'south',
    West = 'west'
}

function move1(distance: number, direction: States)
{

}
move1(1,States.North)

boolean字面量类型

type OneToFive = 1 | 2 | 3 | 4 | 5;

number字面量类型

type Bools = true | false;

使用字面量类型常见报错及解决方法

在使用字面量类型的时候，我们有时会遇到类似于 string类型不能被赋值给’foo’类型的报错。

function isFoo(arg: 'foo')
{

}

const Obj = {
    someProp: 'foo',
}

isFoo(Obj.someProp) // 类型“string”的参数不能赋给类型“"foo"”的参数。

报错产生原因
- someProp的值是‘foo’，所以它的类型被推断为string类型。

解决报错的2个方法

使用类型断言。

function isFoo(arg: 'foo')
{

}

const Obj = {
    someProp: 'foo' as 'foo',
}

isFoo(Obj.someProp)

使用interface 或 type做结构化的类型注解。

function isFoo(arg: 'foo')
{

}

type objType = {
    someProp: 'foo';
}

const Obj: objType = {
    someProp: 'foo',
}

isFoo(Obj.someProp)