typescript 字面量介绍
在TypeScript中,字面量是指在代码中直接使用的具体值,如字符串、数字、布尔值等。字面量类型是TypeScript中的一种特殊类型,它用于定义一组有限的值,并且可以在定义变量或函数时使用字面量作为具体值,也可以作为类型的一部分限定变量或函数的取值范围。
示例如下
let str1 = 'hello world'
const str2 = 'hello world'
上面的代码通过ts类型推论机制,我们可以看到,两个变量类型是不同的
- str1的变量类型是:string
- str2的变量类型是:‘hello world’
这是因为str1是一个变量,(let)可以是任意的string类型数据,额,可以是任意类型字符串,所以变量类型是string
而str2是一个常量(const) 它的值不能发生变化,所以只能是’hello world’,所以它的类型为’hello world’
也就是说,此处的’hello world’就是一个字面量类型,
某个特定的字符串可以作为ts中的类型, 如下
let str1 = 'hello world'
const str2 = 'hello world'
//将hello world作为类型
let str3: 'hello world' = 'hello world'
当然,除了字符串外,任意的js字面量都能当作类型使用
let str1 = 'hello world'
const str2 = 'hello world'
let str3: 'hello world' = 'hello world'
let age: 18 = 18
let isChild: [1, 2] = [1, 2]
搭配联合类型使用
在 TypeScript 中,联合类型(Union Types)是一种特殊的数据类型,它允许一个值具有多种类型中的一种。字面量(Literal)则是表示固定值的语法。可以通过字面量搭配联合类型来定义一个变量,使其只能具有指定的值之一。
示例如下
// 定义一个类型为 "apple" | "banana" 的字面量
type Fruit = "apple" | "banana";
// 定义一个变量,其类型为 Fruit,并赋值为 "apple"
let myFruit: Fruit = "apple";
// 试图将变量赋值为非法值,将会导致编译错误
// myFruit = "orange"; // Type '"orange"' is not assignable to type 'Fruit'
// 可以使用 switch 语句来进行类型检查
function checkFruit(fruit: Fruit) {
switch (fruit) {
case "apple":
console.log("It's an apple.");
break;
case "banana":
console.log("It's a banana.");
break;
// 如果没有匹配的值,将会导致编译错误
// default: // This condition will never be met. Its type 'never' is not assignable to type 'Fruit'
}
}
checkFruit(myFruit); // 输出 "It's an apple."
当然也可以为函数的参数限定值,比如,如果是一个游戏人行走的函数,那么这个函数应该只接收上下左右四个类型的参数
示例如下
首先,需要创建一个联合类型,该类型可以是 “上”、“下”、“左” 或 “右”。在 TypeScript 中,使用 type 关键字来定义类型,然后使用 | 运算符来创建联合类型。
type Direction = "上" | "下" | "左" | "右";
接下来,定义一个函数,该函数接收一个 Direction 类型的参数:
function move(direction: Direction) {
switch (direction) {
case "上":
console.log("角色向上移动");
break;
case "下":
console.log("角色向下移动");
break;
case "左":
console.log("角色向左移动");
break;
case "右":
console.log("角色向右移动");
break;
}
}
然后,就可以像这样调用这个函数:
move("上"); // 输出 "角色向上移动"
move("下"); // 输出 "角色向下移动"
move("左"); // 输出 "角色向左移动"
move("右"); // 输出 "角色向右移动"
当试图传递一个不是 “上”、“下”、“左” 或 “右” 的参数给 move 函数,TypeScript 编译器将会抛出一个错误:
move("前"); // 错误:参数不能赋值给 'Direction' 类型