typescript 获取 type 名称 typescript get方法

一,前言

本篇介绍TS的另一个高级类型-索引类型

从对象中获取一些属性的值,然后建立一个集合

et obj = {
    a: 1,
    b: 2,
    c: 3
}
// 获取对象中的指定属性的值集合
function getValues(obj: any, keys: string[]) {
    return keys.map(key => obj[key])
}
// 抽取指定属性的值
console.log(getValues(obj, ['a','b']))  // [1, 2]
// 抽取obj中没有的属性:
console.log(getValues(obj, ['e','f']))  // [undefined, undefined]

虽然obj中并不包含e, f属性,但TS编译器并未报错
此时使用TS索引类型,对这种模式做类型约束

---

二,TS索引类型的几个概念

1,索引类型的查询操作符

keyof T
表示类型T的所有公共属性的字面量的联合类型

// 定义一个接口Obj含有属性a,b
interface obj {
    a: number
    b: string
}
// 定义变量key,类型为keyof Obj
let key: keyof obj

此时,key的类型为a|b

2,索引访问操作符

T[K]
表示对象T的属性K所代表的类型

3,泛型约束

T extends U
表示泛型变量可以通过继承某个类型,获得某些属性

---

三,索引类型

对索引类型的几个概念了解后,对getValue函数进行改造

约束目的:

从obj对象中抽取的属性数组keys中的元素,一定得是obj对象中的属性

思路:

1,定义泛型变量T, K,分别约束obj对象和keys数组
2,为K增加一个泛型约束,使K继承Obj的所有属性的联合类型, 即`K extends keyof T`
3,此时,函数返回值类型-数组的元素类型,就是属性K对应的数组,即`T[K][]`

代码改造:

function getValues<T, K extends keyof T>(obj: T, keys: K[]): T[K][] {
    return keys.map(key => obj[key])
}

通过索引类型将getValue函数改造后,TS的类型检查就可以发挥作用了

当指定了一个不在obj中的属性时,编译器就会报错

索引类型可以约束对象属性的查询和访问
配合泛型约束能够建立对象,对象属性,属性值之间的约束关系

---

三,结尾

本篇介绍了TS的有一个高级类型-索引类型
通过一个简单的例子:从对象中抽取多个属性对应的值
展示了TS如何通过索引类型对对象的查询和访问进行约束
了解到索引类型3个概念:
1,索引类型的查询操作符
	keyof T	
	表示类型T的所有公共属性的字面量的联合类型
2,索引访问操作符
	T[K]	
	表示对象T的属性K所代表的类型
3,泛型约束
	T extends U	
	表示泛型变量可以通过继承某个类型,获得某些属性