【TS】keyof的妙用

案例1

1、如果,有一个接口,某个变量的类型,是这个接口的 key ?

  • keyof 后面可以跟 一个对象类型或者一个接口类型
  • keyof 是把后面 对象或者接口 的 都提取出来,组成一个联合类型
interface IStudentAttr {
  name: string;
  age: number;
  height: number;
  // 等等…………
}
// 定义一个类型,它必须是 IStudentAttr 的 键 之一
// keyof: 把后面的对象的 key 提取出来生成一个联合类型
type keys = keyof IStudentAttr;

const k: keys = "age";

如果把 k 值 改成 user ,就会提示错误了
在这里插入图片描述

案例2

有一个函数,第一个参数是一个对象,第二个参数是 第一个参数的某一个key

const stu1 = {
  name: "呆呆狗",
  age: 20,
  height: 4.423,
};

const dog = {
  name: "狗1",
  age: 5,
  height: 3.0,
};

// getValueByKey 函数用于获取某个对象的某个属性值
// function getValueByKey(obj: object, name: string) {
//   return obj[name];
// }
function getValueByKey<T extends object, K extends keyof T>(
  obj: T,
  name: K
): T[K] {
  return obj[name];
}

getValueByKey(stu1, "age"); 

在这里插入图片描述
在这里插入图片描述

  • 6
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值