深入浅出 TypeScript|青训营笔记

58 阅读2分钟

基础类型

类型说明
null空值类型
undefined未定义类型
boolean布尔值类型
string字符串类型
number数字类型
object非原始类型
any任何类型
unknown未知类型
never不存在类型
void空类型

在使用基础类型之前先简单理解一下协变、逆变和双向协变(协变+逆变):

  1. 协变:子类仅能赋值给基类
  2. 逆变:基类仅能赋值给子类
  3. 双向协变:同时支持协变和逆变,子类和基类之间可以互相传递值。
  4. 不变:上述三种方式均不适用

我们可以利用上述的子类和基类之间赋值关系推断上述TS类型中的集合关系。如下图所示:

注意:上图表示为TypeScript在非严格模式下的类型集合关系

其中any类型是所有类型(除never)的子兼父类型,unknown是所有类型(除never)的父类型,never则为无父子关系的独立类型。

TS类型之间的赋值规则如下:

  1. any类型遵循双向协变规则,支持除never之外任意类型的赋值与被赋值。
  2. unknown及其他类型(除never)遵循协变规则,即子类型可以赋值给父类型,但父类型无法赋值给子类型。
  3. never类型遵循不变规则,即never类型只能传给never类型。

对象和数组类型

对象类型:定义对象内部每个属性具体的类型。用法示例:

let obj: object = { name: '小明', age: 12 } // 不指定对象内部属性的类型
let obj: { name: string, age: number } = { name: '小明', age: 12 }

数组类型:定义数组内部所有元素共同的类型。用法示例:

let arr_1: string[] = ['h', 'e', 'l', 'l']
let arr_2: Array<string> = ['h', 'e', 'l', 'l']

元组类型:表示一个已知元素数量和类型的数组。用法示例:

let tup: [string, number, boolean] = ['hello', 12, true]

泛型的使用场景

泛型:实际上就是将类型参数化,可以将类型作为参数传入类、函数或接口等。

目的:用于提高类、函数或接口的扩展性和可复用性,扩展或限制其传入的类型。

  1. 利用泛型编写函数
function output<T>(message: T):void { console.log(message) }
output<number>(999) // 999
output<boolean>(true) // true
output<string>('Hello, World') // 'Hello'
  1. 利用泛型编写接口
interface loggerType<T> {
  output: (message: T) => void
}
const logger:loggerType<number> = { output: (message) => { console.log(message) } }
logger.output(999) // 999
  1. 利用泛型编写日志类
class Logger<T> {
    message: T
    constructor(message: T){
        this.message = message
    }
    output(){
        console.log(this.message)
    }
}
new Logger<number>(999).output() // 999
new Logger<boolean>(true).output() // true
new Logger<string>('Hello, World').output() // 'Hello'