场景 & 问题#
在访问对象的成员变量时,经常会用到使用字符串作为索引。在JS中,这样的用法是可以的。但是在TS中,当被访问的对象被赋予类型之后,这样的操作将会抛出异常,示例如下:
## JS中 上述代码将输出我们预期的结果。1
2
3
4
5
6
7
8
9
10
11
12const testObj = {
key1: 1,
key2:2
};
// 获得存有当前对象所有Key(浅层)的一个数组 ["key1","key2"]
const tempKeys = Object.keys(testObj);
tempKeys.forEach((item)=>{
// 正常输出testObj中的值
console.log(testObj[key]);
});
TS中#
1 | interface TestObjType { |
解决思路#
对于这一问题的出现,猜测可能是由于在
但此时可以看到,tempKeys的类型已经变成了 1
const tempKeys = Object.keys(testObj) as Array <keyof TestObjType>;
所以问题很可能是由 Object.keys的默认值导致的。
由此可得如下解决方案1
("key1"|"key2")[]
解决方案#
对于此问题,需要封装一个新的 keys 函数来解决
1 | // 新的keys函数,使用O继承object |
上述代码将输出我们预期的结果。