keyof 和 类型查询

ts v2.1+ keyof 操作符，用于类型查询

export interface IUser {
    email: string;
    password: string;
    address: string;
    phone: string;
}

type UserProps = keyof IUser;

#1 keyof类型提示.jpg

可以看出返回一个union类型。

在写代码中，可以利用keyof对对象中的属性是否存在做出限定，即只能使用对象中的属性名

const todo = {
    id: 1,
    name: 'james',
    address: 'shisanjia' 
}

# K 将是T返回的union类型中的一种
＃　并且返回值为 K[T] 类型
function prop<T, K extends keyof T>(obj: T, key: K) {
    return obj[key];
}

错误情形

const value = prop(todo, 'gender');

#2 keyof 类型限定.png

示例2 对对象数组中的对象的键值进行约束

/**
     * 对数组进行排序
     * @param arr Array<object> 对象数组
     * @param key 对象中的键值
     * @param top 取前几
     * @param order 升序或者降序 默认是降序，即从高到低
     * 示例 let arr = [{name: 'kobe', age: 19}, {name: 'james', age: 17}, {name: 'durant', age: 27}]
     * takeTop(arr, 'age', 10)
     * [{name: 'durant', age: 27}, {name: 'kobe', age: 19}, {name: 'james', age: 17}]
     */
    takeTop<T, K extends keyof T>(arr: T[], key: K, top: number, order: 'desc' | 'asc' = 'desc'): T[] {
        return take(orderBy(arr, [key], [order]), top);
    }

参考文章：

• TypeScript 2.1: keyof and Lookup Types