开篇前言

直接看英文官方文档最靠谱，更新最及时，我搜出来的中文文档，要么不确定内容是否过时，要么翻译官方英文文档中的例子时，存在遗漏了关键描述的情况（比如介绍在泛型约束中使用类型参数时的那个例子），没错我说的是这个翻译地址：

https://www.tslang.cn/docs/handbook/generics.html

相对的，下面这个中文地址就比较靠谱，一直在更新：

https://typescript.bootcss.com/generics.html

一方面文档字太多，另一方面为了边学习文档边写点自己的理解，所以有了我写的这个随笔。毕竟学过的东西，尝试总结述说出来会加深理解，且需要的时候，能快速找回记忆。

即使不打算使用 TS 开发项目，了解一下 TS 基本语法还是非常有价值，收益立竿见影（比余额宝要快）。因为目前项目中依赖了不少第三方库，比如 react、ant design、axios 等，他们都提供了类型声明文件，这使得平时在调用它们的 API 时，可以很好地借助编辑器查看 API 的接口定义，有时候比再去官网翻文档更快更准确，因为你看到的定义正是来自于当前项目中正在使用的版本。

基础类型

  • Boolean
  • Number
  • String
  • Array
  • Tuple
  • Enum
  • Any
  • Void
  • Null and Undefined
  • Never

Boolean、String、Number 和原生一样，参见下方。

  1. // Number 类型
  3. let decimal: number = 6
  4. let hex: number = 0xf00d
  5. let binary: number = 0b1010
  6. let octal: number = 0o744
  9. // Array 类型 有两种使用方法
  11. let list: number[] = [1, 2, 3]
  12. let list: Array<number> = [1, 2, 3]
  15. // Tuple 元组类型 可以用固定数量的元素表示一个数组且元素类型不一定相同
  16. // 注意！自从 TypeScript 3.1 版本及之后，Tuple 类型不能再访问越界元素
  18. let x: [string, number]
  20. x = ['hello', 20]
  23. // Enum 枚举类型 可以为一组数值赋予对应的名字
  25. enum Color {
  26.   Red,
  27.   Green,
  28.   Blue
  29. }
  31. let c: Color = Color.Blue
  33. let colorName: string = Color[2]
  35. console.log(colorName, Color.Red)
  36. console.log(Color)
  39. // Any 类型 表示任何类型
  40. // TS 中会自动类型推断，即使不指定类型
  42. let notSure: any = 4
  43. notSure = 'maybe a string instead'
  44. notSure = false
  46. let list: any[] = [1, true, 'free']
  47. list[1] = 100
  50. // void 和 any 相反，表示没有任何类型
  52. // 比如用来表示函数没有返回值
  53. function warnUser(): void {
  54.   console.log('This is my warning message')
  55. }
  57. // 声明一个 void 类型的变量是没有意义的
  58. // void 类型只能使用 undefined 或 null 赋值
  59. let unusable: void = undefined
  62. // null 类型和 undefined 类型
  63. // 在 TS 中，null 是 undefined 的父类型，
  64. // 所以 undefined 可以赋值给 null
  65. let u: undefined = undefined
  66. let n: null = undefined
  68. // 用 null 赋值给其他类型，默编译通过不报错
  69. // 但如果编译时开启检测 --strictNullChecks
  70. let num: number = 3
  71. num = null
  73. // 开启检测后能规避很多潜在问题，但如果就是想给 num 赋值为 null，
  74. // 可以使用联合类型
  75. let num2: number | null = 3
  76. num2 = null
  79. // never 类型，表示永远不存在的数据类型，
  80. // never 是任何类型的子类型可以赋值给任何类型，但不能被任何类型赋值，包括 any
  82. // never 使用场景1
  83. function error(message: string): never {
  84.   throw new Error(message) // 不能有到达的终点
  85. }
  87. function fail() {
  88.   return error('something faild')
  89. }
  91. // never 使用场景2
  92. function infiniteLoop(): never {
  93.   while (true) { // 不能有到达的终点
  94.     // ...
  95.   }
  96. }
  98. // object 类型，是一个比较泛的类型，不能被赋值为简单类型 Object.create
  99. // 只能传入 Object 或者是 null
  101. // 下面的方法声明，类似于原生的 Object.create() 方法
  102. declare function create(o: object | null): void;
  103. create(42) // 不行
  104. create('string') // 不行
  105. create(false) // 不行
  106. create({ prop: 0 })
  107. create([1, 2, 3])
  108. create(null)
  109. create(undefined)
  110. create(null)
  113. // 类型断言，有时候你比 TS 更知道会是什么类型，所以可以强制将类型进行转换
  115. let someValue: any = 'this is a string'
  116. // 定义为 any 后，敲下面代码时，是不会自动提示存在 length 属性的
  117. someValue.length
  119. // 强制把 someValue 转换为 string 类型
  120. // 此时用点操作符准备写 length 这个词的时候，编辑器就会有提示
  121. let strLength1: number = (<string>someValue).length
  122. // 下面这种写法更推荐一些
  123. let strLength2: number = (someValue as string).length