当前位置: 代码网 > it编程>前端脚本>Vue.js > TypeScript 的 keyof 和 in 操作符

TypeScript 的 keyof 和 in 操作符

2024年08月01日 Vue.js 我要评论
TypeScript 的 keyof 和 in 操作符

keyof   

keyof操作符接受一个对象类型作为参数,返回该对象属性名组成的字面量联合类型

type dog = { name: string; age: number;  };
type d = keyof dog;   //type d = "name" | "age"

in

in的右侧一般会跟一个联合类型,使用in操作符可以对该联合类型进行迭代。 其作用类似js中的for...in或者for...of

下面是一个将接口里的所有属性改为只读属性的demo 其实还可以实现改为可选 必选等属性 原理是一样的

//定义bigs的接口
interface bigs {
    x: string,
    y?: number,
    z: boolean,
}

//将接口属性统一更改为只读,用到了ts的泛型、in操作符
// [k in keyof t]这段代码表示遍历t中的每一个属性,那么t[k]就是每个属性所对应的值,可以简单理解为前者取的是键key,后者取的是值value
type readyonly<t> = {
    readonly [k in keyof t]: t[k]
}
let objs: readyonly<bigs> = {
    x: '123',
    y: 1,
    z: false
}
//就会报错 因为属性是只读属性 
objs.z = true //cannot assign to 'z' because it is a read-only property.(2540)
(0)

相关文章:

版权声明:本文内容由互联网用户贡献,该文观点仅代表作者本人。本站仅提供信息存储服务,不拥有所有权,不承担相关法律责任。 如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 2386932994@qq.com 举报,一经查实将立刻删除。

发表评论

验证码:
Copyright © 2017-2025  代码网 保留所有权利. 粤ICP备2024248653号
站长QQ:2386932994 | 联系邮箱:2386932994@qq.com