TS索引签名
索引:对象或数组的对应位置的名字
数组的索引就是 number 类型的 0,1,2,3...
对象的索引就是 string 类型的属性名
数字索引签名:通过定义接口用来约束数组
type numberIndex{
[index:number]:string
}
const testArray:numberIndex = ["1","2",3]// 不能将类型“number”分配给类型“string”。ts(2322) 所需类型来自此索引签名
可以看到 testArray 数组的第三位不符合 numberIndex 的约束.
字符串索引签名:用于约束对象
type objectType{
[propName:string]:number
}
const testObj:objectType = {
"name":100,
"age":"200" // 不能将类型“string”分配给类型“number”。ts(2322) 所需类型来自此索引签名。
}
可以看到 testObj 的第二个对象不符合 objectType 的约束.
注意事项
可以看到上述的例子我都没有在类型别名中添加其他的约束条件,仅写了一个索引签名约束
type attentionType{
name: string; // Ok
age?: number; // 类型“number | undefined”的属性“age”不能赋给“string”索引类型“string”。ts(2411)
sex?: undefined; // OK
[propName: string]: string | undefined;
}
上述例子说明了,一旦定义了索引签名,那么确定属性和可选属性的类型都必须是它的类型的子集
interface Animal {
name: string;
}
interface Dog extends Animal {
breed: string;
}
interface NotOkay {
[x: string]: Dog;
[x: number]: Animal; // Error
}
interface Okay {
[x: string]: Animal;
[x: number]: Dog; // OK
}
可以同时使用两种类型的索引，但是数字索引的返回值必须是字符串索引返回值类型的子类型。 这是因为当使用 number 来索引时，JavaScript 会将它转换成 string 然后再去索引对象。
作者：Yune_Neko
原文：https://www.cnblogs.com/UmaruChan/archive/2022/05/19/16287509.html
本文内容仅供个人学习、研究或参考使用，不构成任何形式的决策建议、专业指导或法律依据。未经授权，禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载，请保留原文来源信息，不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持！
