Bootstrap

转换的艺术:如何在JavaScript中序列化Map为Object及逆向操作

Map不能直接被JSON.stringify()序列化,需要先转成对象。因为JSON.stringify()方法仅能处理纯JSON数据结构,而Map是一个特殊的集合类型,它不能直接对应于JSON的任何数据结构。

将Map转换为可以被JSON.stringify()序列化的对象,可以遍历Map的所有键值对,并将它们添加到一个普通对象中。

实现一个mapToJson的方法:

const myMap = new Map();
myMap.set('key1', 'value1');
myMap.set('key2', 'value2');
myMap.set('key3', 'value3');

function mayToJson(map) {
    const obj = {};
    for(let [key, value] of map) {
        obj[key] = value;
    }
    return JSON.stringify(obj)
}
console.log(mayToJson(myMap))// {"key1":"value1","key2":"value2","key3":"value3"}

将JSON字符串解析成Map对象,接受一个JSON字符串,将其解析为一个对象,然后创建一个新的Map实例,并将对象的每个属性添加到Map中。这样就可以恢复原始的Map数据结构。

实现一个jsonToMap的方法:

function jsonToMap(jsonStr) {
    const obj = JSON.parse(jsonStr);
    const map = new Map();
    for(let key in obj) {
        if(obj.hasOwnProperty(key)) {
            map.set(key, obj[key]);
        }
    }
    return map;
}
const str = '{"key1":"value1","key2":"value2","key3":"value3"}';
const myMap = jsonToMap(str);
console.log(myMap)
// Map(3) { 'key1' => 'value1', 'key2' => 'value2', 'key3' => 'value3' }

如何处理Map中值为对象的情况?

const myMap = new Map()
myMap.set('key1', {a:1, b:2})
myMap.set('key2', {x: 10, y: 20})
myMap.set('key3', {name: 'summer', age: 18})

function mapToJson(map) {
    const obj = {}
    for(let [key, value] of map) {
        obj[key] = (value instanceof Map) ? mapToJson(value) : value
    }
    return JSON.stringify(obj)
}
const jsonString = mapToJson(myMap)
console.log(jsonString) // {"key1":{"a":1,"b":2},"key2":{"x":10,"y":20},"key3":{"name":"summer","age":18}}

Map里嵌套Map如何处理?

function jsonToMap(jsonStr) {
    const obj = JSON.parse(jsonStr);
    const map = new Map();
    for(let key in obj) {
        if(obj.hasOwnProperty(key)) {
            if (typeof obj[key] === 'object' && obj[key] !== null && !Array.isArray(obj[key])) {
                map.set(key, jsonToMap(JSON.stringify(obj[key])));
            } else {
                map.set(key, obj[key]);
            }
        }
    }
    return map;
}
const str = '{"key1":"value1","key2":{"nestedKey1":"nestedValue1","nestedKey2":"nestedValue2"}}' 

const myMap1 = jsonToMap(str);
console.log(myMap1)
//  Map(2) {
//     'key1' => 'value1',
//     'key2' => Map(2) {
//       'nestedKey1' => 'nestedValue1',
//       'nestedKey2' => 'nestedValue2'
//     }
//   }
;