「这是我参与2022首次更文挑战的第18天,活动详情查看:2022首次更文挑战」
布尔类型
布尔类型 只有true和false两个值,所以布尔类型也可以被认为是 联合类型true | false的别名
let bool: boolean = true
数值类型
在JavaScript中,所有的数值使用浮点数,所以在JavaScript中只有一种数值类型,也就是number类型
let num: number = 123
// TypeScript和JavaScript一样,同样支持其它进制数据
num = 0b1111011
num = 0o173
num = 0x7b
字符串类型
在TypeSCript中,支持单引号,双引号形式的字符串和模板字符串
let name: string = 'Klaus'
let str: string = `name: ${ name }`
数组
在TypeScript中,支持两种形式的数组
type[]--- 例如:number[]Array<type>--- 例如:Array<number>
let arr: number[]
let list: Array<string>
元组
元组(tuple)是TypeScript中特有的数据类型,可以被看成是一种特殊的数组
元组和数组的区别如下:
- 元组的长度是确定的
- 元组各个位置上的元素的数据类型是确定的
let tuple: [number, string, boolean] = [1, 'Alex', true]
枚举
枚举(enum)是TypeScript中特有的数据类型,目的是为一组变量起一组可读性强的别名
// 在约定中,枚举名一般大写
enum Direction {
left,
top,
right,
bottom
}
默认情况下,枚举值从零开始依次递增
console.log(Direction.left) // => 0
console.log(Direction.top) // => 1
console.log(Direction.right) // => 2
console.log(Direction.bottom) // => 3
和TypeScript中的其它数据类型不同的是,在默认情况下,TypeScript中的枚举值会改变JavaScript的运行时
// 上述的enum 在运行时 会被编译为如下代码
"use strict";
var Direction;
(function (Direction) {
Direction[Direction["left"] = 0] = "left";
Direction[Direction["top"] = 1] = "top";
Direction[Direction["right"] = 2] = "right";
Direction[Direction["bottom"] = 3] = "bottom";
})(Direction || (Direction = {}));
从上述编译后的代码可以看出,在TypeScript中的枚举既支持通过别名去取索引值,也支持通过索引去取枚举值
// 通过枚举值 去取 索引值
console.log(Direction.left) // => 0
// 通过索引值 去取 枚举值
console.log(Direction[2]) // => 'right'
在TypeScript中,枚举可以分为数值枚举 和 字符串枚举
在数值枚举中,可以在任意索引值处指定索引值
enum Direction {
left, // 设置之前的值 依旧是默认索引值 --- 0
top = 2, // 2
right = 5, // 5
bottom // 设置之后的值 会依据之前所设置的索引值 自动进行递增 --- 6
}
在字符串枚举中,因为枚举值所对应的值并不是数值,所以在字符串枚举中,枚举值无法依次进行自主的递增
因此,在字符串枚举中,需要为每一个枚举显示的指定对应的枚举值
enum Direction {
left = 'left',
top = 'top',
right = 'right',
bottom = 'bottom'
}
object
object类型用于表示对象类型(包括普通对象,数组,函数等)
将一个变量的类型设置为object,TypeScript的类型检测系统只能知道该变量是对象,
并不能知道该对象上有哪些属性和方法,此时我们只能使用对象上公共的属性和方法
在实际开发中,我们需要TypeScript对我们的对象的属性和方法进行检测
所以在实际使用的时候,推荐使用接口的形式来定义对象,而不是object
let o: object = {
name: 'Klaus',
age: 23
}
void
void表示的是空类型,当一个函数没有返回值的时候,可以使用void类型来指定该函数的返回值类型
function foo(): void {
console.log('foo')
// 因为在JavaScript中,如果一个函数不返回任何的值,那么这个函数默认返回undefined
// 所以在TypeScript中,undefined可以被视为是void类型的子类型
}
never
never表示的是那些不存在或者不可能达到的值,一般作为会抛出异常或者存在死循环代码的函数的返回值
function fun(): never {
throw new Error('error')
}
function func(): never {
while(true) {
// ....
}
}
never类型也可以用来确保所有的类型都已经被处理
function demo(v: number | string) {
switch(typeof v) {
case 'number':
// ...
break;
case 'string':
// ....
break;
default:
// 如果在之前的处理逻辑中,我们已经将v的所有可能的类型都进行了判断
// 那么进入default中的v的类型 一定是never
// 那么下述语句是不会报错的,否则会出现错误
let n: never = v
}
}
never类型是其它任意类型的子类型,包括 null 和 undefined
没有任何类型是never的子类型
let n = (() => {
while(true) {
// ...
}
})()
let un: undefined
let nul: null
un = n
nul = n
undefined / null
undefined 和 null 是TypeScript中两个比较特殊的类型
undefined类型只有一个值 即undefined
null类型只有一个值 即 null
在默认情况下,null和undefined是其它任意类型的子类型
但是在开启strictNullChecks的时候,null和undefined只能赋值给自己类型的值,不可以作为其它任意类型的子类型(undefined是void的子类型除外)
let nul: null = null
let und: undefined = undefined
any
为了方便JavaScript程序迁移成TypeScript类型,TypeScript类型提供了一个特殊的类型any
如果一个变量的值的类型被设置成了any,那么TypeScript的类型检测系统便不会对这个变量进行类型检测
如果在项目中为每个变量的类型都指定为any,那么TypeScript的表现形式就和JavaScript基本没有任何的区别
所以如无特殊情况,不推荐在项目中将变量的数据类型设置为any
在开发中,推荐打开noImplicitAny,这个配置可以在我们将变量设置为any类型或者某个变量的数据类型被推导为any的时候,即使给予我们警告
类型断言
TypeScript认为编写者一定比TypeScript的编译器更明白自己所编写的代码
而且在某些特定情况下,因为一些限制,可能导致TypeScript编辑器无法正确的为我们推导出正确的数据类型
此时就可以使用类型断言, 而类型断言可以被认为是在TypeScript中进行强制类型转换的一种形式
有两种方式可以使用类型断言
-
变量 as 类型--- 推荐 可以在JSX中使用 -
<类型> 变量 --- 不推荐 不可以在JSX中使用
let num: number
let str: string = num as string
str = <string>num