序列化和反序列化包含 Map 对象的复杂数据

解决方案1

  1. replacer 函数:

    function replacer(key, value) {
      if(value instanceof Map) {
        return {
          dataType: 'Map',
          value: Array.from(value.entries()),
        };
      } else {
        return value;
      }
    }
    

    这个函数在遇到 Map 对象时,将其转换为一个包含 dataTypevalue 的对象。value 是 Map 转换成的数组。

  2. reviver 函数:

    function reviver(key, value) {
      if(typeof value === 'object' && value !== null) {
        if (value.dataType === 'Map') {
          return new Map(value.value);
        }
      }
      return value;
    }
    

    这个函数在解析 JSON 时,检查是否有 dataType 为 ‘Map’ 的对象,如果有,就将其转回 Map 对象。

  3. 使用方法:

    const str = JSON.stringify(originalValue, replacer);
    const newValue = JSON.parse(str, reviver);
    

    stringifyparse 中使用这两个函数。

优点

  1. 可以处理深层嵌套的数据结构。
  2. 保留了 Map 的结构和数据。
  3. 不需要修改原有的 Map 对象。

注意事项

  1. 这种方法会增加 JSON 字符串的大小,因为每个 Map 都会被包装在一个额外的对象中。
  2. 如果您的数据结构中有循环引用,这种方法可能会导致问题。

解决方案2

如果用例比较简单,只需要将 Map 转换为普通对象,可以考虑以下方法:

const mapToObj = map => Object.fromEntries(map);
const objToMap = obj => new Map(Object.entries(obj));

// 使用
const map = new Map([['a', 1], ['b', 2]]);
const obj = mapToObj(map);
const jsonStr = JSON.stringify(obj);
const newObj = JSON.parse(jsonStr);
const newMap = objToMap(newObj);

这种方法更简单,但只适用于键是字符串的情况。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值