如何迭代 Typescript 接口属性？

Question

我有一个接口FilterData ，如下所示：

export interface FilterData {
  variables?: string[];
  processDefinitionKey?: string;
}

在对服务器的请求中，我收到了类型为FilterData filterSettings我需要对其进行迭代。

这就是我现在正在做的事情：

for (const key in filterSettings) {
  filterString += `${key}_eq_${filterSettings[key]},`;
}

但我收到以下错误：

元素隐式具有“任何”类型，因为“字符串”类型的表达式不能用于索引类型“过滤器数据”。 在类型 'FilterData'.ts(7053) 上找不到具有类型参数的索引签名

我在这里读到该接口在运行时不存在，但我不知道可能是什么解决方法。 如何迭代接口 object？

Answer 1

确实，接口在运行时不存在，但您仍然可以从该接口迭代现有 object 的属性。

请在此处查看我的答案How to loop through Record<K, T>以了解迭代 object 的方法

Answer 2

您可以对 typescript 说您确定key是keyof Filterdata ：

for (const key in filterSettings) {
  filterString += `${key}_eq_${filterSettings[key as keyof FilterData]},`;
}

您可以在tsconfig.json中设置noImplicitAny: false

Answer 3

实际上，该接口在运行时并不存在。 您必须对所需的属性进行硬编码 - 实现接口的 object 也可能具有任何其他属性：

const filterSettings: FilterData;

for (const key of ['variables', 'processDefinitionKey']) {
  filterString += `${key}_eq_${filterSettings[key]},`;
}