TypeScript 循环遍历对象

Question

我有一个非常简单的问题，我想在 TypeScript 中循环一个对象。

const an_object = {
    one: 1,
    two: 2,
    three: 3
};

for (let key in an_object) {
    let value = an_object[key];
    // Do something with value
}

这一行 let value = an_object[key]; 导致 TypeScript 错误：

[react-scripts] 元素隐式具有“any”类型，因为“string”类型的表达式不能用于索引类型“{ one: number;二：号码；三：号码； }'。

我是 TypeScript 新手，不太了解问题所在。

这适用于 JavaScript，但不适用于 TypeScript。

关于如何在 TypeScript 中正确循环对象而不出错有什么建议吗？

Answer 1

TypeScript 被命名为 TYPEScript 是有原因的。

问题是没有指定对象内部的内容。

关于如何在 TypeScript 中正确循环对象而不出错有什么建议吗？

要正确执行此操作，您应该指定对象内部的内容。这可以通过以下方式完成：

1. 创建界面

interface MyObjectsInterface {
    [key: string]: number;
}

1. 将其分配给对象。

const an_object: MyObjectsInterface = {
    one: 1,
    two: 2,
    three: 3
};

1. 现在您可以在 forloop 中使用该值

for (let key in an_object) {
    let value: number = an_object[key];
    // Do something with value
}

通过这种方式，您将始终知道对象内部的内容。

Answer 2

为此，我通常会编写一个辅助函数，以便我的“for each object property”循环可以编写如下：

objForEach(an_object, (k, v) => {
    console.log('key', k, 'value', v);
});

实现如下。有用的是，通过使其通用化，参数k 和v 可以根据an_object 正确推断其类型：

function objForEach<T>(obj: T, f: (k: keyof T, v: T[keyof T]) => void): void {
    for (let k in obj) {
        if (Object.prototype.hasOwnProperty.call(obj, k)) {
            f(k, obj[k]);
        }
    }
}

请注意，我使用hasOwnProperty 来检查该属性是否属于对象本身，而不是其原型链中的另一个对象（参见例如this question）。