typescript typeof 和 keyof

引言

很多人一看到typeof，就会联想到js中的类型判断，但是在ts中也有typeof的使用，但是它可不是用来判断类型的哦，他的作用是可以在类型上下文中进行类型查询，并且只能对变量的类型或者属性查询

keyof 用于读取type或者interface的key值

读取interface的key 

interface testa {
    name:"何以",
    sex:'皆有'
}

type testaType =  keyof testa 
// "name"|"sex"
let namea:testaType="name"

读取interface里的key 组成 | 选项

读取type的key

type testb= {
        name:string,
        sex:number
}

type testbType = keyof testb
// "name"|"sex"
let testb:testbType="name"

读取type        里的key 组成 | 选项

typeof  用于变量（基本数据类型）

let nameTmp = "sjf"
type nameTmpType = typeof nameTmp
let str1:nameTmpType = '666'

type nameTmpType = typeof nameTmp 中的typeof 会读取 nameTmp变量的数据类型

typeof 用于对象 
 

let info ={
    name:'张三',
    age:18,
    isMan:true
}

type infoType = typeof info
//相当于

type infoType ={
     name:string,
     age:number,
     isMan:boolean
}
//可以理解为typeof读取了对象的key和key的类型组装成了一个新的type或者interface
let user1:infoType={
    name:'232323',
    age:12121,
    isMan:false
}

typeof 用于对象的属性

let testInfo1={
    name:'何以解忧，唯有杜康',
    count:1,
    sub:{
        name:'11312',
        isChange:true,
        subCount:0
    }
}
type  testInfo1Interface = typeof testInfo1.sub
type  testInfo1Type = keyof testInfo1Interface
let name4:testInfo1Type = "name"
let isChange:testInfo1Type="isChange"  

typeof 用于读取函数的参数和返回值类型

function add(a:number,b:number):number{
    return a+b
}

type AddType = typeof add
type AddReturnType = ReturnType<AddType> //number
type AddParamsType = Parameters<AddType>//[a:number,b:number]