Javascript 和 Typescript：使用 for..of 对对象进行迭代

Posted 2023-02-23

【中文标题】Javascript 和 Typescript：使用 for..of 对对象进行迭代

【英文标题】：Javascript and Typescript: iteration over object with for..of

【发布时间】：2018-03-19 03:30:18

【问题描述】：

来自ES6 iteration over object values，我采用了一种迭代对象值的方法。这是我的实现：

function* entries (obj): IterableIterator<any> 
    for (const key of Object.keys(obj)) 
        const value = obj[key];
        yield [
            key,
            value,
        ];
    

那我想在render()React Component的方法中使用：

render () 
    const that = this;
    const newVar = (() => 
        const elements = [];
        for (const [key, value] of entries(that.filters)) 
            elements.push(<h2>JSON.stringify(key) JSON.stringify(value)</h2>);
        
        return elements;

    )();
    return (
        <section>
            newVar
        </section>
    );

但如果我在 Chrome 开发者控制台中使用 .map 文件调试此代码，newVar 是一个空数组。如果我在entries 生成器中提醒obj，我得到了正确的对象。我错过了一些非常简单的东西吗？预先感谢您的每一个答案。我使用带有es5 选项的Typescript，我读到它支持生成器：Generators and Iteration for ES5/ES3。

【问题讨论】：

顺便说一句，您既不需要that，也不需要IIFE。

您确定要传递您链接的 TypeScript 文档中提到的 --downlevelIteration 标志吗？

@Bergi 我不是 :) 非常感谢，在你回答我之前我浪费了几个小时，请将你的帖子写成新的答案，我会接受的。我知道这很愚蠢:)

【参考方案1】：

我使用带有 es5 选项的 Typescript，我读到它支持生成器：Generators and Iteration for ES5/ES3。

它还说您需要为此使用--downlevelIteration 标志。否则，它仍会将for … of-loops 转换为数组迭代，这会在没有.length 属性的生成器实例等可迭代对象上失败。