1. 解释
TypeScript 中的类型有:
- 原始类型
- boolean
- number
- string
- void
- null
- undefined
- bigint
- symbol
- 元组 tuple
- 枚举 enum
- 任意 any
- unknown
- never
- 数组 Array
- 对象 object
2. 布尔类型
最简单的数据类型就是 true / false 值:
- 1
- 2
3. 数字类型
二进制数、十进制数、十六进制数都可以用 number 类型来表示。
- 1
- 2
- 3
- 4
- 5
- 6
4. 字符串类型
双引号或者单引号表示字符串:
- 1
- 2
使用模板字符串:
- 1
- 2
模板字符串使用反引号来代替普通字符串中的用双引号和单引号。模板字符串可以包含特定语法 ${expression} 的占位符,占位符内可以写变量名,模板字符串会进行变量值的解析。
5. void 类型
当一个函数没有返回值时,可以将其返回值类型定义为 void:
- 1
- 2
- 3
声明一个 void 类型的变量没有什么用,因为你只能将它赋值为 undefined 和 null:
- 1
6. null 类型和 undefined 类型
undefined 和 null 是所有类型的子类型。
一般项目是默认开启 --strictNullChecks 检测的(这句话不明白是什么意思),如果你将 tsconfig.json 中 strictNullChecks 选项设置为 false,下面这种操作不会报错,不过尽量不要这么做:
- 1
- 2
- 3
7. 数组类型
数组类型有两种表示方法,第一种在元素类型后接上 [],表示由此类型元素组成的一个数组:
- 1
- 2
另一种方式是使用数组泛型(泛型后续会单独介绍),Array<元素类型>:
- 1
- 2
混合各种元素类型:
- 1
推荐使用第一种数组类型的表示方法,书写比较简洁直观。
8. any 类型
有时候接收来自用户的输入,我们是不能确定其变量类型的。这种情况下,我们不希望类型检查器对这些值进行检查,而是直接让它们通过编译阶段的检查,此时可以使用 any:
- 1
- 2
- 3
- 4
- 5
- 6
- 7
如果一个数据是 any 类型,那么可以访问它的任意属性,即使这个属性不存在:
- 1
- 2
- 3
- 4
- 5
- 6
- 7
从上面的例子中可以看到,any 类型几乎可以做任何操作,这样很容易编写类型正确但是执行异常的代码。我们使用 TypeScript 就是为了代码的健壮性,所以要尽量减少 any 的使用。
9. object 类型
object 表示非原始类型(non-primitive type):
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
可以看到枚举、数组、元组和普通对象都是 object 类型。
10. 容易混淆的点
- TypeScript 中描述类型要用
小写,比如 boolean、number、string等; - 大写开头的如 Boolean、Number、String 代表的是 JavaScript 的构造函数:
- 1
- 2
- 3
- 4
- 5
代码解释:
第 1 行,通过 new Number('10') 得到的是一个构造函数,本质是一个对象。
第 2 行,Number('10') 与 10 都是声明一个数字 10 的方法,本质就是一个数字。
第 4 - 5 行,instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。a 是一个对象,它的 __proto__ 属性指向该对象的构造函数的原型对象 Number,所以为 true。b 是一个数字,所以为 false。
__proto__ 是非标准属性,你也可以使用 Object.getPrototypeOf() 方法来访问一个对象的原型:
- 1
11. 小结
本小节介绍了 TypeScript 一些基本类型,需要记住的是:
- TypeScript 中描述类型要用
小写。 - 不要滥用
any!
鲁ICP备案14017198号