10. Typescript 类型断言/类型别名

92 阅读2分钟

1. 类型断言

类型断言的作用是,当我声明了一个变量,但是没有定义类型,TS 会在没有明确类型的时候推测出一个类型。断言的类型是声明时赋值的类型,如果声明时没有定义类型也没有赋值的情况下。TS 会断言出 any 类型。可以执行任何操作。当出现类型断言结果后,不能够再赋值别的类型给变量

// 类型推论
let str = 'abc' // str 的类型被推断为 string
str = 123 // 报错,不能将 number 类型赋值给 string 类型

// 当没有定义类型也没有赋值时,ts 会推断出类型为 any
let str1;
str1 = 'abc'
str1 = 123

2. 类型别名

通过 type 关键字,可以给一个类型定义一个名字,多用于复合类型。

2.1. 定义类型别名

// 类型别名

// 定义类型别名
type Name = string;

// 定义函数别名
type NameResolver = () => string;

// 定义联合类型别名
type NameOrResolver = Name | NameResolver;

// 使用类型别名
function getName(n: NameOrResolver): Name {
  if (typeof n === 'string') {
    return n;
  } else {
    return n();
  }
}

2.2. 类型别名 type 和接口 interface 的区别

  • 类型别名有时和接口很像,但是可以作用于原始值,联合类型,元组以及其它任何你需要手写的类型。
  • 类型别名是通过 type 来定义的,而接口是通过 interface 来定义的。
  • 类型别名可以是泛型,接口不可以。
  • interface可以继承 type 只能通过 & 交叉类型合并
  • type 可以定义 联合类型 和 可以使用一些操作符 interface不行
  • interface 遇到重名的会合并 type 不行

2.3. type 高级用法

  • 类型别名可以自己包含自己
  • 可以进行条件判断

// 高级用法:
// 类型别名可以包含自己
type Tree<T> = {
  value: T;
  left: Tree<T>;
  right: Tree<T>;
}

// true 类型别名可以进行条件判断
type a = 1 extends number ? true : false;

3. 代码下载

📎类型断言.ts

📎类型别名.ts