ES6中数据结构Map与其它数据类型的互相转换
前言
小伙伴们大家好。上篇文章中为大家详细分享了ES6中的Map数据结构,本篇文章将在上一篇文章的基础上对Map做一个补充。关于Map还有一个知识点没有分享到,就是关于Map和其它类型的互相转换。
通过上篇文章的学习,我们了解到Map是ES6为我们提供的一个很强大的数据类型。那么在使用的过程中难免会遇到与其它类型打交道的操作。下面我们就来看下Map与其它几个类型互相转换的一些常用操作。
Map与数组互相转换
大家都知道数组在我们日常开发中是必不可少的一个数据类型了,就在我们上一篇文章分享Map使用的时候也是不只一次的提到了数组。那么数组和Map是如何实现互相转换的呢。下面为大家揭晓
Map 转换为数组:
Map转换为数组最简单的方式就是通过扩展运算符(...)
还可以通过对Map进行遍历组成数组(这个方法这里不再展示)
数组转换为Map:
通过将数组作为参数传给Map的构造函数即可(数组的成员也应该是包含了一个个元素的数组)
也可以通过遍历数组然后调用Map的set函数进行组装(相对复杂,这里也不再赘述)
//Map转换为数组 const map = new Map() .set('hj', 'xhj') .set({'name': 'xhj'}, ['xhj']); [...map]// [ ['hj', 'xhj' ], [ {'name': 'xhj'}, ['xhj'] ] ] //数组转换为对象 const arrMap = new Map([ ['hj', 'xhj' ], [ {'name': 'xhj'}, ['xhj'] ] ]); 复制代码
Map与对象互相转换
Map转换为对象,需要借助循环遍历,将Map的成员遍历后组装成对象,需要注意的是,如果Map的键都是字符串,则可以无损的转换为对象,如果有非字符串的键名,则键名会被转成字符串,然后再作为对象的键名
对象转换为Map,可以借助Object.entries()函数,将该函数的返回值作为参数传递给Map的构造函数即可
另外也可通过遍历对象,并借助Map的set函数自己实现转换
//Map转换为对象 const map = new Map(); map.set('hj','xhj').set('yq','lyq') let obj = {}; for (let [key,value] of map) { obj[key] = value; } //对象转换为Map(一) let obj = {'hj':'xhj','yq':'lyq'}; let map = new Map(Object.entries(obj)); //对象转换为Map(二) let obj = {'hj':'xhj','yq':'lyq'}; const map = new Map(); for (let key of Object.keys(obj)) { map.set(key, obj[key]); } 复制代码
Map与JSON互相转换
Map 转为 JSON分为两种情况:
Map 的键名都是字符串,这时可以先将Map转换为对象然后再通过JSON.stringify转为 JSON
Map 的键名有非字符串,这时可以先将Map转为数组然后再通过JSON.stringify转为JSON
Json转为Map也分为两种情况:
所有键名都是字符串,先通过JSON.parse转换为JSON对象,然后再遍历对象转为换Map
整个JSON是一个数组,且每个数组成员本身,又是一个由两个成员组成的数组。这时,它可以一一对应地转为 Map
//Map转为对象JSON 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); //Map转为数组JSON let map= new Map([ ['hj', 'xhj' ], [ {'name': 'xhj'}, ['xhj'] ] ]); JSON.stringify([...map]); //JSON 转换为Map (键名为纯字符串) let obj = JSON.parse('{"hj": "xhj", "yq": "lyq"}') const map = new Map(); for (let key of Object.keys(obj)) { map.set(key, obj[key]); } //JSON 转换为Map (JSON是一个数组) const map = new Map(JSON.parse([ ['hj', 'xhj' ], [ {'name': 'xhj'}, ['xhj'] ] ])); 复制代码
总结
以上就是关于Map和其它几个常用数据类型的互相转换,关于数据结构Map我们用了两个篇幅来分享,也足以见得Map的强大所在。本篇文章就介绍到这里,希望小伙伴们喜欢。
喜欢的小伙伴欢迎点赞留言加关注哦!
作者:西瓜watermelon
链接:https://juejin.cn/post/7020420668323790884