preface

Hello, guys. In the previous article, we shared the Map data structure in ES6 in detail. This article will make a supplement to Map on the basis of the previous article. There is another knowledge about Map that has not been shared, that is, the mutual conversion between Map and other types.

Through the study of the previous article, we learned that Map is a very powerful data type provided by ES6. Then it is inevitable to encounter operations dealing with other types in the process of use. Let's take a look at some common operations of mutual conversion between Map and several other types.

Map and array are converted to each other

We all know that array is an essential data type in our daily development. When we shared the use of Map in our last article, we mentioned array more than once. So how do arrays and maps convert to each other. Let's announce it

• Convert Map to array:
  • The easiest way to convert a Map to an array is through the extension operator (...)
  • You can also form an array by traversing the Map (this method is not shown here)
• Convert array to Map:
  • You can pass the array as a parameter to the Map constructor (the members of the array should also be an array containing elements)
  • It can also be assembled by traversing the array and calling the set function of Map.

//Convert Map to array
const map = new Map()
  .set('hj', 'xhj')
  .set({'name': 'xhj'}, ['xhj']);
[...map]// [ ['hj', 'xhj' ], [ {'name': 'xhj'}, ['xhj'] ] ]

//Convert array to object
const arrMap = new Map([ 
['hj', 'xhj' ], 
[ {'name': 'xhj'}, ['xhj'] ]
]);

Map and object conversion

• To convert a Map into an object, you need to use circular traversal to traverse the members of the Map and assemble them into objects. It should be noted that if the keys of the Map are all strings, they can be converted into objects without damage. If there is a non string key name, the key name will be converted into a string and then used as the key name of the object
• To convert an object into a Map, you can pass the return value of the function as a parameter to the Map constructor with the help of the Object.entries() function
• In addition, you can also traverse the object and realize the conversion by yourself with the help of the set function of Map

//Convert Map to object
const map = new Map();
map.set('hj','xhj').set('yq','lyq')
let obj = {};
for (let [key,value] of map) {
  obj[key] = value;
}

//Object to Map (I)
let obj = {'hj':'xhj','yq':'lyq'};
let map = new Map(Object.entries(obj));

//Object to Map (II)
let obj = {'hj':'xhj','yq':'lyq'};
const map = new Map();
for (let key of Object.keys(obj)) {
   map.set(key, obj[key]);
 }

Map and JSON are converted to each other

• There are two situations for converting Map to JSON:
  • The key names of the Map are all strings. In this case, you can first convert the Map to an object, and then convert it to JSON through JSON.stringify
  • The key name of the Map has a non string. In this case, you can first convert the Map to an array, and then convert it to JSON through JSON.stringify
• There are also two situations when converting Json to Map:
  • All key names are strings. First convert them to JSON objects through JSON.parse, and then traverse the objects to Map
  • The whole JSON is an array, and each array member itself is an array composed of two members. At this time, it can be converted to Map one by one

//Convert Map to JSON object
const map = new Map();
map.set('hj','xhj').set('yq','lyq')
let obj = {};
for (let [key,value] of map) {
  obj[key] = value;
}
JSON.stringify(obj);

//Convert Map to array JSON
let map= new Map([ 
['hj', 'xhj' ], 
[ {'name': 'xhj'}, ['xhj'] ]
]);
JSON.stringify([...map]);

//Convert JSON to Map (key name is pure string)
let obj = JSON.parse('{"hj": "xhj", "yq": "lyq"}')
const map = new Map();
for (let key of Object.keys(obj)) {
   map.set(key, obj[key]);
 }
//Convert JSON to Map (JSON is an array)
const map = new Map(JSON.parse([ 
['hj', 'xhj' ], 
[ {'name': 'xhj'}, ['xhj'] ]
]));

summary

The above is about the mutual conversion between Map and several other common data types. We spent two pages on data structure Map, which is enough to see the power of Map. This article is introduced here. I hope you like it.

Like the little partner, welcome to like the message and pay attention!