千鋒教育前端TypeScript入門視頻教程(陸神頂配版TS入門教程)
2023-07-23 21:08 作者:bili_77199263736 | 我要投稿

1. 字面量類型
在 TypeScript 中,字面量不僅可以表示值,還可以表示類型,即字面量類型。TypeScript 支持以下字面量類型:
- 字符串字面量類型;數(shù)字字面量類型;布爾字面量類型;模板字面量類型。
(1)字符串字面量類型
字符串字面量類型其實(shí)就是字符串常量,與字符串類型不同的是它是具體的值:
type Name = "TS"; const name1: Name = "test"; // ? 不能將類型“"test"”分配給類型“"TS"”。ts(2322) const name2: Name = "TS";
實(shí)際上,定義單個字面量類型在實(shí)際應(yīng)用中并沒有太大的用處。它的應(yīng)用場景就是將多個字面量類型組合成一個聯(lián)合類型,用來描述擁有明確成員的實(shí)用的集合:
type Direction = "north" | "east" | "south" | "west"; function getDirectionFirstLetter(direction: Direction) { return direction.substr(0, 1); } getDirectionFirstLetter("test"); // ? 類型“"test"”的參數(shù)不能賦給類型“Direction”的參數(shù)。 getDirectionFirstLetter("east");
這個例子中使用四個字符串字面量類型組成了一個聯(lián)合類型。這樣在調(diào)用函數(shù)時,編譯器就會檢查傳入的參數(shù)是否是指定的字面量類型集合中的成員。通過這種方式,可以將函數(shù)的參數(shù)限定為更具體的類型。這不僅提升了代碼的可讀性,還保證了函數(shù)的參數(shù)類型。
除此之外,使用字面量類型還可以為我們提供智能的代碼提示:
(2)數(shù)字字面量類型
數(shù)字字面量類型就是指定類型為具體的數(shù)值:
type Age = 18; interface Info { name: string; age: Age; } const info: Info = { name: "TS", age: 28 // ? 不能將類型“28”分配給類型“18” };
可以將數(shù)字字面量類型分配給一個數(shù)字,但反之是不行的:
let val1: 10|11|12|13|14|15 = 10; let val2 = 10; val2 = val1; val1 = val2; // ? 不能將類型“number”分配給類型“10 | 11 | 12 | 13 | 14 | 15”。
(3)布爾字面量類型
布爾字面量類型就是指定類型為具體的布爾值(true
或false
):
let success: true; let fail: false; let value: true | false; success = true; success = false; // ? 不能將類型“false”分配給類型“true”
由于布爾字面量類型只有true
或false
兩種,所以下面?value
?變量的類型是一樣的:
let value: true | false; let value: boolean;
(4)模板字面量類型
在 TypeScript 4.1 版本中新增了模板字面量類型。什么是模板字面量類型呢?它一字符串字面量類型為基礎(chǔ),可以通過聯(lián)合類型擴(kuò)展成多個字符串。它與 JavaScript 的模板字符串語法相同,但是只能用在類型定義中使用。
標(biāo)簽: