一.值类型

1.简介

TypeScript 规定，单个值也是一种类型，称为“值类型”;或者叫做字面类型.

你可以把它想象为一个不可以改变的常量

let app: "hello";

app = "hello"; // 正确
app = "world"; // 报错

2.const 赋值情况

TypeScript 推断类型时，遇到const命令声明的变量，如果代码里面没有注明类型，就会推断该变量是值类型。

const value = "Hello World"; // value 的类型为 "hello world"

const message: string = "hello world"; // message 的类型为string

 鼠标悬停后就会出现类型为 "hello world"

这样推断是合理的，因为const命令声明的变量，一旦声明就不能改变，相当于常量。值类型就意味着不能赋为其他值。

注意:

const命令声明的变量，如果赋值为对象，并不会推断为值类型。        

const object_value = {
  name: "John",
  age: 30,
};
// 类型为:
// {
//   name: string;
//   age: number;
// }

 但是可能会出现一些奇怪的现象:

const x: 5 = 4 + 1; // 报错

为什么会出现这样的情况呢?

等号左侧的类型是数值5，等号右侧4 + 1的类型，TypeScript 推测为number。由于5是number的子类型，number是5的父类型，父类型不能赋值给子类型，所以报错了

但是，反过来是可以的，子类型可以赋值给父类型。

如果一定要让子类型可以赋值为父类型的值，就要用到类型断言(将右边的类型变为与左边的类型一致)

const x: 5 = (4 + 1) as 5; // 正确

二.联合类型

1.简介

联合类型（union types）指的是多个类型组成的一个新类型，使用符号|表示。

联合类型A|B表示，任何一个类型只要属于A或B，就属于联合类型A|B。

let value: string | number;
// value 既可以是 string 也可以是 number
value = "hello";
value = 123;

2.联合类型可以与值类型相结合

let color: "red" | "green" | "blue" | "yellow";

color = "red";
color = "balck"; // Error: Type '"balck"' is not assignable to type '"red" | "green" | "blue" | "yellow"'.

3.使用时一般需要"类型缩小"

如果一个变量有多种类型，读取该变量时，往往需要进行“类型缩小”（type narrowing），区分该值到底属于哪一种类型，然后再进一步处理。

“类型缩小”是 TypeScript 处理联合类型的标准方法，凡是遇到可能为多种类型的场合，都需要先缩小类型，再进行处理。实际上，联合类型本身可以看成是一种“类型放大”（type widening），处理时就需要“类型缩小”（type narrowing）。

比如:

function getPort(scheme: "http" | "https") {
  switch (scheme) {
    case "http":
      return 80;
    case "https":
      return 443;
  }
}

三.交叉类型

1.简介

交叉类型（intersection types）指的多个类型组成的一个新类型，使用符号&表示。

需要同时满足所包含的类型

let value: number & string;
// 变量value同时是数值和字符串，这当然是不可能的，所以 TypeScript 会认为value的类型实际是never。

2.交叉类型的主要用途是表示对象的合成

其中可以使用多个&

let person: { name: string; age: number } & {
  address: string;
  phone: string;
} & {
  email: string;
};

person = {
  name: "John",
  age: 30,
  address: "123 Main St",
  phone: "555-1234",
  email: "john@example.com",
};

3.交叉类型常常用来为对象类型添加新属性

type student = {
  id: number | string;
  name: string;
  age: number;
};

type people = student & {
  gender: string;
  address: string;
};

const s: student = {
  id: 1,
  name: "Tom",
  age: 20,
};
const p: people = {
  id: 1,
  name: "Tom",
  age: 20,
  gender: "male",
  address: "China",
};

下一篇:TypeScript---class类型