map和set数据结构

今天学习了map和set数据结构,感觉比我之前学习的东西稍微好理解一些。就在这里分享一下自己的心得!

set数据结构

ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。
Set本身是一个构造函数,用来生成 Set 数据结构。只要是这个数据结构具有interator接口,都可作为参数传递。

    let str = ['r', 'j', 'l', 'r'];
    let strset = new Set(str);
    let laststr = [...strset];
    console.log(laststr); //输出['r','j','l']

因为set数据结构不能有重复的值,所以在转换的过程中实现了去重。

const s = new Set();
[2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x));
for (let i of s) {
  console.log(i);
}
// 2 3 5 4

上面这段代码是我复制阮一峰老师博客的一段代码,重在理解set的add()方法。通过该方法可以向set返回的对象里面传值。

我所知道的有两种方式将set数据结构转换为数组

  let set = new Set(['1', '2']);
  console.log(Array.from(set));  //或者[...set]

set的内容相对比较少,接下来看一下map数据结构

map数据结构

javaScript 的对象(Object),本质上是键值对的集合(Hash 结构),但是传统上只能用字符串当作键。这给它的使用带来了很大的限制。上面代码原意是将一个 DOM 节点作为对象data的键,但是由于对象只接受字符串作为键名,所以element被自动转为字符串[object HTMLDivElement]。

为了解决这个问题,ES6 提供了 Map 数据结构。它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。也就是说,Object 结构提供了“字符串—值”的对应,Map 结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构,Map 比 Object 更合适。

map的set()方法就相当于set结构的add()方法。

感觉这一章就是这些数据结构的方法的使用,基本上没啥好说的。最后就是展示一下数据结构的转换。

对象转换为map数据结构

   let obj = {
            name: 'renjialei',
            age: 18
        }
        function ObjToMap(objs) {
            let map = new Map();
            for (let key in objs) {   
                map.set(key, objs[key]);
            }
            return map;
        }
        console.log(ObjToMap(obj));  

map数据结构转换为对象

   let map = new Map([
                ['name', 'renjialei'],
                ['age', 18]
            ]);

            function MapToObj(map) {
                let obj = {};
                for (let [key, value] of map) {
                    obj[key] = value;
                }
                return obj;
            };
            console.log(MapToObj(map));

map数据结构转换为json

  function MapToJSON(map) {
                return JSON.stringify(MapToObj(map));
            }
            console.log(MapToJSON(map));
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值