使用jQuery/JS序列化Map对象

Question

[这是关于SO的第一个问题,所以对任何错误道歉]

我正在尝试在Cookie中保存地图,如下图所示.

var myMap = new Map();
myMap.set("k1", {
    a1: "...",
    a2: "...",
    a3: "..."
});

为此,我必须格式化为JSON.我尝试了很多方法,比如:

$.toJSON(myMap)
$.param(myMap)
JSON.stringify(myMap)

但它们似乎都不起作用......

所以,我这样做了:

var serial = [];
myMap.forEach(function(value){
    serial.push(value);
});
var result = $.toJSON(serial)

(必须在解码JSON时重建密钥...)

有一种更好的方法来序列化Map对象吗？

Answer 1

不完全是典型的"stringify",但你可以使用扩展运算符结合JSON.stringify(),这将给你一个数组...

var myMap = new Map();
myMap.set("k1", { a1: "...", a2: "...", a3: "..." });
myMap.set("k2", { b1: "...", b2: "...", b3: "..." });

var myJSON = JSON.stringify([...myMap]);
alert(myJSON);

这会给你......

[["k1",{"a1":"...","a2":"...","a3":"..."}],["k2",{"b1":"...","b2":"...","b3":"..."}]]

并再次将其转换为Map ...

var recoveredMap = new Map(JSON.parse(myJSON));

Answer 2

虽然如果您想对立即映射进行字符串化，则扩展运算符很​​好，但如果它们嵌套在任何数据结构中，您将面临问题。

JSON.stringify 和 JSON.parse 都支持回调函数：

JSON.stringify(value[, replacer[, space]])
JSON.parse(text[, reviver])

所以你可以编写如下函数：

function replacer (key, value){
    if (value.__proto__ == Map.prototype) {
        return {
            _type: "map",
            map: [...value],
        }
    } else return value;
}

function reviver (key, value){
    if (value._type == "map") return new Map(value.map);
    else return value;
}

现在，您可以轻松地对映射进行字符串化/解析，无论它们嵌套的深度如何：

let obj = {
    map: new Map([
        [1, new Map([
            [1,2],
            [3,4],
        ])],
        [2,3],
    ]),
};
console.log(obj);
let str = JSON.stringify(obj, replacer);
console.log(str);
console.log(JSON.parse(str));
console.log(JSON.parse(str, reviver));