TypeScript-索引签名和只读属性
原创
#前言
索引签名和只读属性是TypeScript中的两个重要概念。索引签名允许您创建动态属性的对象，提高灵活性，而只读属性通过 "readonly" 关键字确保属性不可被修改，有助于保持对象的不可变性。这两个特性共同帮助开发者编写更具可维护性和类型安全性的代码
索引签名概述
索引签名用于描述那些 “通过索引得到” 的类型，比如
arr[10]或obj["key"]只要key和value满足索引签名的限定即可, 无论有多少个都无所谓
- 首先来看看
obj["key"]的形式
interface FullName {
[propName: string]: string
}
let obj: FullName = {
firstName: 'Jonathan',
lastName: 'Tang',
}
console.log(obj["firstName"]);如果不满足接口索引签名限定的类型会报错如下：
image-20211128022231918
- 无论
key是什么类型最终都会自动转换成字符串类型, 所以如下的代码就没有报错
interface FullName {
[propName: string]: string
}
let obj: FullName = {
firstName: 'Jonathan',
lastName: 'Tang',
false: '666'
}
console.log(obj["firstName"]);- 不报错的原理也挺简单的，还是如上那句话
无论key是什么类型最终都会自动转换成字符串类型来验证一下这一点即可其实在我 ES6 文章当中已经说过了所以基础好还是非常重要的
image-20211128022602395
- 再来看看
arr[10]的形式 - 方式一
interface stringArray {
[propName: number]: string
}
let arr: stringArray = {
0: 'a',
1: 'b',
2: 'c'
};
console.log(arr[0]);- 方式二
interface stringArray {
[propName: number]: string
}
let arr: stringArray = ['a', 'b', 'c'];
console.log(arr[0]);
console.log(arr[1]);
console.log(arr[2]);只读属性概述
让对象属性只能在对象刚刚创建的时候修改其值 在只读属性限定前面添加
readonly即可
image-20211128023135391
interface FullName {
firstName: string
readonly lastName: string
}
let myName: FullName = {
firstName: 'Jonathan',
lastName: 'Lee'
};
myName.lastName = 'Wang';
console.log(myName);- TS 内部对只对属性进行了扩展，扩展出来了一个
只读数组（ReadonlyArray）
let arr2: ReadonlyArray<string> = ['a', 'b', 'c'];
console.log(arr2[0]);
arr2[0] = '666';
console.log(arr2[0]);
image-20211128024352886
end02
输入图片说明
最后
本期结束咱们下次再见👋~
🌊 关注我不迷路，如果本篇文章对你有所帮助，或者你有什么疑问，欢迎在评论区留言，我一般看到都会回复的。大家点赞支持一下哟~ 💗
输入图片说明
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
评论
登录后参与评论
推荐阅读
目录
腾讯云开发者
