TypeScript 中的 ES7 Object.entries() 不起作用

Posted 2023-03-13

【中文标题】TypeScript 中的 ES7 Object.entries() 不起作用

【英文标题】：ES7 Object.entries() in TypeScript not working

【发布时间】：2017-02-06 01:48:11

【问题描述】：

我在使用 TypeScript 转换 ES7 代码时遇到问题。这段代码：

const sizeByColor = 
    red: 100,
    green: 500,
;

for ( const [ color, size ] of Object.entries(sizeByColor) ) 
    console.log(color);
    console.log(size);

给出错误：

TypeError: Object.entries is not a function

TypeScript v2.0.3

tsconfig.json:

"compilerOptions": 
    "module": "commonjs",
    "target": "es6",
    "noImplicitAny": true,
    "noEmitOnError": true,
    "outDir": "dist",
    "allowSyntheticDefaultImports": true,
    "experimentalDecorators": true,
    "pretty": true,
    "lib": [ "es2017" ],
,
"exclude": [
    "node_modules"
],
"include": [
    "./node_modules/@types/**/*.d.ts",
    "./src/**/*.ts"
]

我想用Object.entries() 迭代槽对象，所以我分配了内部定义"lib": [ "es2017" ]，但是，打字稿仍然不允许我转译它。

【问题讨论】：

欢迎来到 SO :) 请用...介绍您的问题或问题的条目，并详细说明您正在使用什么。添加你做了什么，什么有效，什么无效的例子。谢谢

是的 :) 抱歉有点迂腐，但别担心，当我来到这里时，我也有很多麻烦 ;) 不要忘记投票所有相关/帮助你的东西当答案符合您的需要时标记为已接受。谢谢！

如果你使用 angular 2+ 你需要添加 import 'core-js/es7/object';到你的 polyfills.ts 文件

将“es2019”添加到您的 tsconfig 库数组中

【参考方案1】：

当我有一个全局编译器但在./node_modules 中没有本地编译器时，我可以重现您的问题。

就我而言，编译器只是不知道要使用哪个 tsconfig.json 文件。将其指向特定的 tsconfig.json 文件会有所帮助：

tsc  --project ./tsconfig.json

我还在库中添加了dom 选项，因为es2017 无法识别控制台：

"lib": [
    "es2017",
    "dom"
]

【讨论】：

我必须将"es2017" 添加为.babelrc 中的预设以及此答案中的lib 选项

【参考方案2】：

如果你不想在你的库集合中包含完整的ECMAScript 2017 (ES8)，那么你也可以使用es2017.object来满足Object.entries的分辨率和相关的。

这是一个最小的工作示例：

src/index.ts

const sizeByColor = 
  red: 100,
  green: 500,
;

for (const [color, size] of Object.entries(sizeByColor)) 
  console.log(color);
  console.log(size);

tsconfig.json

  "compilerOptions": 
    "lib": ["dom", "es2016", "es2017.object"],
    "rootDir": "src",
    "target": "es6",
    "outDir": "dist"
  ,
  "exclude": [
    "node_modules"
  ]

注意：如果 "target" 设置为 "es6"，则 TypeScript 默认使用以下 "lib" 条目（如果未指定）：["dom", "dom.iterable", "es6", "scripthost"]。

当手动设置"lib" 时，库默认值会被覆盖，这就是为什么我需要添加"dom"（在我的代码中使用console.log）和"es6" 来演示ES6 和部分ES8 的用法（@987654334 @)。

来源：TypeScript Compiler Options

【参考方案3】：

嗯，看来我忘了将core-js polyfill 注入Object.entries。 import 'core-js/fn/object/entries'; 有了这个 polyfill 转译工作，但 IDE 仍在抱怨它。当我直接包含@types/core-js 时，IDE 还可以，但是由于“lib/es2017”中的重复声明，Typescript 会崩溃。看起来IDE（WebStorm）无法处理tsconfig.json 中的“lib”设置

编辑： 是的，我尝试修改 WebStorm 设置，将“使用 TypeScript 服务（实验）”设置为 true 后，一切正常！

【讨论】：

好吧，帮我进一步解释一下。你在哪里导入'core-js/fn/object/entries'？

@Winnemucca 在 Typescript 配置中设置 es2017.object 仅提供 Object.entries 的声明。如果您所在的环境实际上没有此方法（例如 Node.js 6），则需要使用 polyfill。 core-js库提供了各种polyfills。

【参考方案4】：

这对我有用；当然，您可以在此处更改任何适合您的界面/类型...

 for (const [field, values] of Object.entries<any>(filters)) 

【参考方案5】：

对于一个独立的 Typescript 应用程序，我必须将 lib es2019.object 添加到 tsconfig，并导入 polyfill 以使其工作:)

import 'core-js/es/object/from-entries';