TypeScript高级类型之索引类型

先看下面的代码：

let obj={
    a:1,
    b:2,
    c:3
}
function getValues(obj:any,keys:string[]){
    return keys.map(key=>obj[key])
}
getValues(obj,['a','b'])  //[1,2]

这个函数的意思是返回对象中指定属性的值所组成的数组。

如果我们指定不存在的属性，getValues(obj,['e','f']) ，会返回[undifined,undifined]，这时TS也不会报错，这并不是我们所期望的。下面我们就通过索引类型来解决这个问题。

首先我，在了解索引类型之前，我们先来了解三个小知识。

1、索引类型的查询操作符  keyof T(表示类型T的所有公共属性的字面量的联合类型)

interface s{
    a:number,
    b:number
}
let key:keyof s;  //let key: "a" | "b"

2、索引访问操作符 T[k]  ，对象T的属性k所代表的类型

let value:s['a'];  //let value:s['a'];

3、T extend U  继承

了解上述之后，我们便来改造我们的getValues函数

let obj={
    a:1,
    b:2,
    c:3
}

//K extends keyof T 让K继承obj所有属性的联合类型
function getValues<T,K extends keyof T>(obj:T,keys:K[]):T[K][]{
    return keys.map(key=>obj[key])
}

getValues(obj,['a','b']);
getValues(obj,['e','f']);  //这个时候就会报错了

索引类型可以实现对对象属性的查询和访问，然后再配合泛型约束，就能够使我们建立对象，对象属性以及属性值之间的约束关系。