我想开始使用ES6 Map而不是JS对象,但我被阻止了,因为我无法弄清楚如何使用JSON.stringify()一个Map。我的密钥保证是字符串,我的值将始终是列表。我是否真的必须编写一个包装器方法来序列化?
答案 0 :(得分:40)
你不能。
地图的键可以是任何东西,包括对象。但JSON语法只允许字符串作为键。因此,在一般情况下这是不可能的。
我的密钥保证是字符串,我的值将始终是列表
在这种情况下,您可以使用普通对象。它将具有以下优势:
答案 1 :(得分:17)
由于Map
实例没有任何属性,因此无法直接对其进行字符串化,但是可以将其转换为元组数组:
jsonText = JSON.stringify(Array.from(map.entries()));
反之,使用
map = new Map(JSON.parse(jsonText));
答案 2 :(得分:6)
尽管ecmascript还没有提供方法,但是如果将JSON.stingify
映射到JavaScript原语,仍然可以使用Map
来完成。这是我们将使用的示例Map
。
const map = new Map();
map.set('foo', 'bar');
map.set('baz', 'quz');
您可以使用以下帮助函数将其转换为JavaScript Object文字。
const mapToObj = m => {
return Array.from(m).reduce((obj, [key, value]) => {
obj[key] = value;
return obj;
}, {});
};
JSON.stringify(mapToObj(map)); // '{"foo":"bar","baz":"quz"}'
此功能的助手功能会更加紧凑
const mapToAoO = m => {
return Array.from(m).map( ([k,v]) => {return {[k]:v}} );
};
JSON.stringify(mapToAoO(map)); // '[{"foo":"bar"},{"baz":"quz"}]'
这甚至更容易,您只需使用
JSON.stringify( Array.from(map) ); // '[["foo","bar"],["baz","quz"]]'
答案 3 :(得分:3)
鉴于您的示例是一个简单的用例,其中键将成为简单类型,我认为这是JSON字符串化Map的最简单方法。
JSON.stringify(Object.fromEntries(map));
我对Map的基础数据结构的思考方式是作为键值对数组(作为数组本身)。所以,像这样:
const myMap = new Map([
["key1", "value1"],
["key2", "value2"],
["key3", "value3"]
]);
由于底层数据结构是我们在Object.entries中找到的,因此我们可以像在数组上那样在Map上利用Object.fromEntries()
的原生JavaScript方法:
Object.fromEntries(myMap);
/*
{
key1: "value1",
key2: "value2",
key3: "value3"
}
*/
然后剩下的就是在结果上使用JSON.stringify()。
答案 4 :(得分:1)
使用spread sytax地图可以在一行中序列化:
JSON.stringify([...new Map()]);
并使用以下方法反序列化:
let map = new Map(JSON.parse(map));
答案 5 :(得分:1)
字符串化Map
实例(作为键的对象就可以了):
JSON.stringify([...map])
或
JSON.stringify(Array.from(map))
或
JSON.stringify(Array.from(map.entries()))
输出格式:
// [["key1","value1"],["key2","value2"]]
答案 6 :(得分:0)
JSON.stringify
和JSON.parse
都支持第二个参数。分别为replacer
和reviver
。通过以下的replacer和reviver,可以添加对本机Map对象的支持,包括深度嵌套的值
function replacer(key, value) {
const originalObject = this[key];
if(originalObject instanceof Map) {
return {
dataType: 'Map',
value: Array.from(originalObject.entries()), // or with spread: value: [...originalObject]
};
} else {
return value;
}
}
function reviver(key, value) {
if(typeof value === 'object' && value !== null) {
if (value.dataType === 'Map') {
return new Map(value.value);
}
}
return value;
}
用法:
const originalValue = new Map([['a', 1]]);
const str = JSON.stringify(originalValue, replacer);
const newValue = JSON.parse(str, reviver);
console.log(originalValue, newValue);
结合数组,对象和地图的深层嵌套
const originalValue = [
new Map([['a', {
b: {
c: new Map([['d', 'text']])
}
}]])
];
const str = JSON.stringify(originalValue, replacer);
const newValue = JSON.parse(str, reviver);
console.log(originalValue, newValue);
答案 7 :(得分:0)
即使您嵌套了地图,下面的解决方案仍然有效
function stringifyMap(myMap) {
function selfIterator(map) {
return Array.from(map).reduce((acc, [key, value]) => {
if (value instanceof Map) {
acc[key] = selfIterator(value);
} else {
acc[key] = value;
}
return acc;
}, {})
}
const res = selfIterator(myMap)
return JSON.stringify(res);
}
答案 8 :(得分:0)
// somewhere...
class Klass extends Map {
toJSON() {
var object = { };
for (let [key, value] of this) object[key] = value;
return object;
}
}
// somewhere else...
import { Klass as Map } from '@core/utilities/ds/map'; // <--wherever "somewhere" is
var map = new Map();
map.set('a', 1);
map.set('b', { datum: true });
map.set('c', [ 1,2,3 ]);
map.set( 'd', new Map([ ['e', true] ]) );
var json = JSON.stringify(map, null, '\t');
console.log('>', json);
> {
"a": 1,
"b": {
"datum": true
},
"c": [
1,
2,
3
],
"d": {
"e": true
}
}
希望比上面的答案更令人沮丧。
答案 9 :(得分:0)
只想分享我的 Map 和 Set JSON.stringify 版本。 我正在整理它们,对调试很有用...
function replacer(key, value) {
if (value instanceof Map) {
const reducer = (obj, mapKey) => {
obj[mapKey] = value.get(mapKey);
return obj;
};
return [...value.keys()].sort().reduce(reducer, {});
} else if (value instanceof Set) {
return [...value].sort();
}
return value;
}
用法:
const map = new Map();
const numbers= new Set()
numbers.add(3);
numbers.add(2);
numbers.add(3);
numbers.add(1);
const chars= new Set()
chars.add('b')
chars.add('a')
chars.add('a')
map.set("numbers",numbers)
map.set("chars",chars)
console.log(JSON.stringify(map, replacer, 2));
结果:
{
"chars": [
"a",
"b"
],
"numbers": [
1,
2,
3
]
}