Question

我已经定义了一个静态属性：

private static colorsByName: { [index: string]: MyColorClass}

但是当我尝试使用此处列出的答案中的for... of时：TypeScript for-in statement

for(let value of MyClass.colorsByName) {
    ...
}

我收到错误：

输入{[index：string]：MyColorClass; }不是数组类型或字符串类型。

如果我切换到使用for in，则错误消失，但value的输入为any。

for(let value of MyClass.colorsByName) {
    ...
}

在这种情况下value的实际类型是什么？理想情况下，我想循环遍历colorsByName属性中的所有值，无论是在配对方法中，还是只返回返回的MyColorClass类型。

for(let value of MyClass.colorsByName) {
    // value: MyColorClass
}

我有什么选择？

Answer 1

这不是一个阵列。它是一个带有字符串键和MyColorClass类型属性的对象。

你可以做什么，把它变成一个数组。您可以通过获取对象的键数组然后将键映射到对象的属性来执行此操作：

Object.keys(MyClass.colorsByName).map(prop => MyClass.colorsByName[prop]).forEach(color =>{
    // use color here
});

由于您可能会这么做，您可以创建一个可重用的函数来将属性转换为数组：

function propsToArray<T>(obj: { [index: string]: T; } | { [index: number]: T; }) {
    return Object.keys(obj).map(prop => obj[prop]);
}

然后您可以将其与for...of：

一起使用

for (const color of propsToArray(MyClass.colorsByName)) {
    // use color here
}

或forEach：

propsToArray(MyClass.colorsByName).forEach(color => {
    // use color here
});

Object.values

或者，您也可以使用Object.values()：

for (const color of Object.values(MyClass.colorsByName)) {
    // use color here
}

但如果您使用它，可能需要添加polyfill。

Answer 2

的for..in

在查看Typescript文档（Typescript: Iterators and Generators）时，我们发现for..in语法将遍历对象的键。

for..in返回正在迭代的对象上的键列表，而for..of返回正在迭代的对象的数值属性的值列表。

我们可以利用它来索引我们的对象并获得强类型值：

// Go through each key of the indexed object:
for (const key in indexedObject)
{
   // Get the indexed item by the key:
   const indexedItem = indexedObject[key];
   // Now we have the item.

   // Use it...
}

解决方案

我们可以使用它来获得问题的优雅解决方案：

// Go through each named color:
for (const colorName in colorsByName)
{
   // Get the strongly typed color with this name:
   const color = colorsByName[colorName]; // : MyColorClass
   // Now we have the the strongly typed color with this name.

   // Paint the world in a techni-colour rainbow...
}

如何在TypeScript中迭代字符串索引数组？

2 个答案:

Object.values

的for..in

解决方案