103

I'm working on an ng2 implementation. I'm using the following function call to convert an object to an array:

var authors = Object.entries(responseObject.Authors);

This is a standard js function. However, the ts compiler returns the following error:

"Property 'entries' does not exist on type 'ObjectConstructor'"

Based on a quick google it appears that the solution may be to change the compilerOptions target property from es5 to es6. However, after some previous research for a previous issue, I thought that I was able to leverage es6 functionality by including the additional "lib" property on my tsconfig.json below:

  "compilerOptions": {
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "module": "commonjs",
    "noEmitOnError": true,
    "noImplicitAny": false,
    "outDir": "../Scripts/",
    "removeComments": false,
    "sourceMap": true,
    "target": "es5",
    "moduleResolution": "node",
    "lib": [
      "es2015",
      "dom"
    ]
  }

I also tried changing the target property to es2015 and then rebuilt the project and executed "typescriptUsingTsConfig" but I still get the same error. Any idea what I can do here in order to leverage the Object.entries() function?

Penny Liu
  • 15,447
  • 5
  • 79
  • 98
user8334943
  • 1,467
  • 3
  • 11
  • 21

3 Answers3

162

You're quite correct that changing target is the wrong approach and changing lib is the correct approach, however you have specified the wrong version of the language. According to MDN, Object.entries was officially added in the ES2017 specification.

"lib": ["es2017"]

is therefore what you must specify instead*.

If you wish to add only the declarations for the methods of the Object function that were added in ES2017, TypeScript allows you to specify a more granular value.

"lib": ["es2017.object"]

As noted by Alexander Bird, by default, the implicit value of the "lib" option is dependent on the value specified for "target" if present.

For example:

"target": "es2017"

Will cause the correspondingly prefixed "lib.*" to be included by default unless "lib" is specified explicitly.

Note that you will likely wish to add a polyfill of the implementation itself, such as the this one, to ensure this works in older runtimes.

Note: as an alternative you can specify any later version

"lib": ["es2020"]

or naturally even

"lib": ["esnext"]

This last will include the declarations for the very latest standard library features known to the TypeScript language. As it represents a moving target, this option should be used with care since polyfilling all of the corresponding runtime is by definition a complex task that will require research and may involve loading different polyfills depending on your target runtime.

Additionally, the array nature of the "lib" option allows you to combine multiple values to match your runtime. For example, to match es2015 capable web browsers with the addition of these object methods as provided by a polyfill, you can write

"lib": ["es2015", "es2017.object", "dom"]

See the TypeScript Handbook for additional details.

Note: a few commenters asked why it would be wrong to change --target instead of --lib as both would enable the code to type check? The reason is that --target changes how the code is transpiled. For example, "target": "es2017" means that async functions won't be transformed for older runtimes. It is incorrect because the intent was to enable the use of additional libraries, not to change the output syntax and it is therefore important to distinguish between syntactic features and library features.

Aluan Haddad
  • 29,886
  • 8
  • 72
  • 84
  • thanks aluan. that does the trick. would this be supported by ie10+? trying to figure out whether or not I should add a polyfill – user8334943 Jul 31 '17 at 19:26
  • 1
    @user8334943 no you will definitely need a polyfill for IE 10. The MDN link has browser support information at the bottom. – Aluan Haddad Jul 31 '17 at 19:27
  • 1
    Note for others: if you didn't use `lib` compiler option already, there may have been a default value based on your target that will be overridden when you set `lib`. See [the compiler options documentation](https://www.typescriptlang.org/docs/handbook/compiler-options.html) for the list of defaults. I had to explicitly add the default `lib` parameters for my target as well as `es2017.object`. – alexanderbird Sep 05 '17 at 20:53
  • what version of typescript is es2017 available in? – Jessy Dec 12 '17 at 16:47
  • It worked fine (after restarting vs code) `"@angular/cli": "^1.4.9",`, `"@angular/core": "^4.2.4"` and `"typescript": "^2.3.4"`. – Jessy Dec 13 '17 at 19:09
  • 1
    @AluanHaddad for sure :) I agree with keeping updated as long as possible and I'll be performing the update soon. This is a large application, with many developers so updating needs to be planned. Thanks for your input! – Jessy Dec 15 '17 at 14:37
  • 1
    Why is it more correct to update `lib` instead of `target`? – rjh Sep 21 '18 at 12:33
  • 2
    @rjh Target changes how the code is transpiled. For example, `"target": "es2017"` means that `async` functions won't be transformed for older runtimes. It is incorrect because the intent was to enable the use of additional libraries, not to change the output syntax. – Aluan Haddad Sep 21 '18 at 19:21
  • I am getting error while writing Unit tests for Object.entries(), error message is "undefined is not a constructor". In my typescript file its working fine without any errors, target : 'es5', lib: [es2017, dom]. – Irrfan23 Jun 17 '19 at 07:00
  • @Irrfan23 that's a runtime error, it's not TypeScript related. I'd need to see code to understand since entries doesn't involve constructors. – Aluan Haddad Jun 17 '19 at 07:51
  • @AluanHaddad its not runtime error, this error was persisting because es6 does not support Object.entries(). I just import entries from es7 in my olyills.ts file and it worked. – Irrfan23 Jun 17 '19 at 09:05
  • @Irrfan23 which demonstrates that it's a runtime error. – Aluan Haddad Jun 17 '19 at 16:58
  • 1
    And always remember to RESTART your VSCode after this! – Luis Antonio Canettoli Ordoñez Aug 27 '20 at 21:30
  • I get the error es2019 or later is required. Works with ES2020. – Reece Daniels Jul 29 '22 at 17:14
24

The accepted answer didn't work for me, but I adapted the answer from Property 'assign' does not exist on type 'ObjectConstructor' like this:

const changedFields = (<any>Object).entries(this.ngForm.form.controls)
                                   .filter(value => value[1].dirty);

Sharing for anyone with the same situation

KyleMit
  • 30,350
  • 66
  • 462
  • 664
Hien Nguyen
  • 24,551
  • 7
  • 52
  • 62
  • 2
    Thanks Nguyen......I am using Angular 6 with typescript 2.6.2 and this is what worked for me. I would love if someone could explain it. – MichaelE Jun 13 '20 at 13:32
  • worked for me in the typescript playground. that's some serious voodoo – Julian Suggate Jul 28 '20 at 13:49
  • 1
    In the typescript playground, you can't currently set `--lib` so you have to use `--target` to specify `--lib` implicitly – Aluan Haddad Sep 25 '20 at 14:52
  • You're a hero. I couldn't change the lib because it is generated by another application where I don't have the possibility to change tsconfig. – David Fariña Dec 07 '20 at 11:53
1

go to "tsconfig.json" and adding :

"lib": ["es2019"];
Sadegh Maasoomi
  • 132
  • 4