【TypeScript】类型断言、联合类型、交叉类型

TypeScript 高级类型

• 交叉类型

• 联合类型

• 类型别名

• 类型索引

• 类型约束

• 映射类型

• 条件类型

在TypeScript中，type和interface都可以用来定义类型的别名。然而，它们之间有一些关键的区别。

1. 灵活性和使用范围：type更加灵活，它可以用来定义任意类型的别名，包括原始类型、函数、对象等。相比之下，interface只能用来定义对象类型的别名。
2. 类型组合：type可以使用交叉类型(intersection type)和联合类型(union type)来组合多个类型，而interface不能。
3. 继承：type可以使用继承和扩展类型的语法来继承和扩展另一个类型，而interface不能。

联合类型

联合类型的语法规则和逻辑“或”的符号一致，表示其类型为连接的多个类型中的任意一个，本质上是一个交的关系。

let phone:number | string = "123"
let fn = function (type:number | boolean):boolean {
  return !!type
}

交叉类型

将多个类型合并为一个类型。相当于 并 的操作。

interface People {
  name:string,
  age: number
}
interface Man {
  sex: number
}
// 类似于 extends
const jack = (man:People & Man):void => {
  console.log(man);
}
jack({
  name:'jack',
  age:22,
  sex:0
})

类型别名

类型别名会给一个类型起个新名字，类型别名有时和接口很像，但是可以作用于原始值、联合类型、元组以及其它任何需要手写的类型。

type some = boolean | string

const b: some = true // ok
const c: some = 'hello' // ok
const d: some = 123 // “123” “some”

可以看到，类型别名和接口使用十分相似，都可以描述一个对象或者函数。

两者的区别在于：

• interface 只能用于定义对象类型，而 type 的声明方式除了对象之外还可以定义交叉、联合、原始类型等
• interface 可以合并重复声明、type 不可以

类型索引

keyof 类似于 Object.keys，用于获取一个接口中 Key 的联合类型（或）。

interface Button {
 type: string
 text: string
 }
 
type ButtonKeys = keyof Button
// 等效于
type ButtonKeys = "type" | "text"

类型约束

通过关键字extends进行约束，不同于在 class后使用extends的继承作用，泛型内使用的主要作用是对泛型加以约束。

type BaseType = string | number | boolean

// 只能是字符串、数字、布尔这几种基础类型
function copy<T extends BaseType>(arg: T): T {
	return arg
}

映射类型

通过 in 关键字做类型的映射，遍历已有接口的 key 或者是遍历联合类型，如下例子：

type Readonly<T> = {
  readonly [P in keyof T]: T[P];
};
interface Obj {
  a: string
  b: string
}
type ReadOnlyObj = Readonly<Obj>

上述的结构，可以分成这些步骤：

• keyof T：通过类型索引keyof的得到联合类型’a’ | ‘b’
• P in keyof T 等同于p in ‘a’ | ‘b’,相当于执行了一次forEach的逻辑，遍历’a’|b
  所以最终ReadOnlyobj的接口为下述：

interface ReadOnlyObj {
	 readonly a: string;
	 readonly b: string;
 }

条件类型

T extends U ? X : Y

类型断言

let fn = function (num:number | string):void {
  console.log((num as string).length);
  console.log((<string>num).length);
}
fn('123') // 3
fn(13) // undefined

interface A {
  run:string
}
interface B {
  build: string
}
let fn = (type: A | B):void => {
  console.log((type as A).run);
  console.log((<A>type).run);
}
fn({
  run:"run" // run
})
fn({
  build:"build" // undefined
})