NodeJs - 集合对象序列化问题

一. 集合对象的序列化问题

案例如下:我们创建一个Map和一个Set集合,并用JSON.stringify进行序列化操作。

(async () => {
    const map = new Map();
    map.set(1, '1');
    map.set(2, '1');
    console.log('map', JSON.stringify(map));

    const set = new Set();
    set.add(1);
    set.add(2);
    console.log('set', JSON.stringify(set))
})();

结果如下:
在这里插入图片描述
可见,JSON.stringifyMapSet 的序列化是不支持的。那么我们如何进行修改?我们一点点分析。

1.1 Map 和 Object 的区别

  • 一个 Object 的键只能是字符串或者 Symbols但一个 Map 的键可以是任意值。
  • Map 中的键值是有序的(FIFO 原则),而添加到对象中的键则不是。
  • Map 的键值对个数可以从 size 属性获取,而 Object 的键值对个数只能手动计算。
  • Object 都有自己的原型,原型链上的键名有可能和你自己在对象上的设置的键名产生冲突。

1.2 Map 的相关转换

先说下两个方法:

  • Object.entries():返回一个数组,成员是对象自身的所有可遍历属性的键值对数组。
  • Object.fromEntries():是Object.entries()的逆操作,用于将一个键值对数组转为对象。

Map 和 Array 互转

ArrayMap:如果想要Array转换成Map,我们则需要传入一个二维数组,每个数组的第一个值为key,第二个值为value

MapArray:使用Array.from即可。

(async () => {
    //二维数组
    const arr = [["key1", "value1"], ["key2", "value2"]];
    // Map 构造函数可以将一个 二维 键值对数组转换成一个 Map 对象
    const myMap = new Map(arr);
    console.log(myMap);
    // 使用 Array.from 函数可以将一个 Map 对象转换成一个二维键值对数组
    const outArray = Array.from(myMap);
    console.log(outArray);
})();

Map 和 Object 互转

如果想把Map进行序列化,我们可以把它转换成Object对象。有两种思路:

  • 我们可以将Map对象转换为一个Object对象,再进行序列化。
  • 我们遍历Map对象的键值对,然后构造出一个Object对象。
(async () => {
    const map = new Map();
    map.set(1, '1');
    map.set(2, '1');
    // JS语法(TS里面可能会提示报错) Object.fromEntries 用于将一个键值对数组转为对象
    console.log('map-js', JSON.stringify(Object.fromEntries(map)));
    // TS语法(JS和TS通用),通过遍历键值对来构造
    const tsMapObj = Array.from(map.entries()).reduce((obj, [key, value]) => (obj[key] = value, obj), {})
    console.log('map-ts', JSON.stringify(tsMapObj));
    // Object 转 Map
    const mapFromObj = new Map(Object.entries(tsMapObj));
    console.log(mapFromObj)
    console.log(mapFromObj.get('1'))
    console.log(mapFromObj.get('2'))
})();

结果如下:(转成Object对象之后,就可以进行序列化输出啦)
在这里插入图片描述

1.3 Set 的相关转换

Set 和 Array 互转

(async () => {
    const set = new Set();
    set.add(1);
    set.add(2);
    // Set 转 Array,
    const arr = Array.from(set)
    console.log('set', JSON.stringify(arr));
    // Array 转 Set 构造Set的时候传入即可
    console.log(new Set(arr))
})();

结果如下:
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Zong_0915

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值