Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

What is Object.fromEntries ()

2025-03-29 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/02 Report--

This article mainly explains "what is Object.fromEntries ()". Friends who are interested may wish to have a look at it. The method introduced in this paper is simple, fast and practical. Now let the editor take you to learn "what is Object.fromEntries ()"?

We get object.entries (), which converts an object → array. But what if you want to do the opposite? Don't think about it! Use Object.fromEntries () to array → object.

Const keyValuePair = [['cow',''], ['pig','],]; Object.fromEntries (keyValuePair); / / {cow:'', pig:''}

Object.fromEntries

Let's first point out how the object is dissected. An object is something with a key and a value.

Const object = {key: 'value',}

If we want to convert something to an object, we need to pass something with these two requirements: key and value.

Array with nested key-value pairs

Map object

Convert an array to an object with Object.fromEntries

This is a nested array with key-value pairs

Const nestedArray = [['key 1,' value 1'], ['key 2,' value 2'],]

When we apply Object.fromEntries to it, we can get objects from it.

Object.fromEntries (nestedArray); / / {key 1: "value 1", key 2: "value 2"}

Using Object.fromEntries to convert Map into object

JavaScript ES6 brings us a new object called map, which is very similar to an object.

Let's create a new Map object

/ / use the constructor const map = new Map ([['key 1,' value 1'], ['key 2,' value 2'],]); / / or we can use the instance method, "set" const map = new Map (); map.set ('key 1,' value 1'); map.set ('key 2,' value 2') / / result / / Map (2) {"key 1" = > "value 1", "key 2" = > "value 2"}

Now, we use Object.fromEntries to convert Map to an object

Object.fromEntries (map); / / {key 1: "value 1", key 2: "value 2"}

Object.fromEntries and other types of type errors

Be careful when you try to pass other data types to Object.fromEntries, all of which will throw an error

Type error not captured by ❌ (Uncaught TypeError)

Make sure that only key-value pairs are passed.

Object.fromEntries vs Object.entries

Object.fromEntries and Object.entries have the opposite effect. So Object. Entries will transform our array and return a new nested array of key-value pairs. And Object.fromEntries will turn the array back to an object.

Const object = {key1: 'value1', key2:' value2'}; const array = Object.entries (object); / / [["key1", "value1"], ["key2", "value2"]] Object.fromEntries (array); / / {key1: 'value1', key2:' value2'}

Conversion from Object to Object

If you read the original TC39 proposal, that's why this new approach was introduced. With the introduction of Object.entries, there is no easy way to convert the result back to an object.

Usually, when we choose to use Object.entries, it gives us access to many beautiful array methods, such as filter. But after completing the conversion, we were a little perplexed by the array.

Const food = {meat:', broccoli:', carrot:'}; / / Stuck in Array land const vegetarian = Object.entries (food). Filter (([key, value]) = > key! = = 'meat',); / / [["broccoli", "], [" carrot ","]]

We can take advantage of all these useful array methods, but we can still get our objects back, and finally, the conversion from objects to objects.

Const food = {meat:', broccoli:', carrot:''}; / / Yay, still in Object land const vegetarian = Object.fromEntries (Object.entries (food). Filter (([key, value]) = > key! = = 'meat'),); / / {broccoli:', carrot:''}

Browser support

With the exception of Internet Explorer, most major browsers support this method.

At this point, I believe you have a deeper understanding of "what is Object.fromEntries ()". You might as well do it in practice. Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report