J'aimerais commencer à utiliser ES6 Map au lieu d'objets JS mais je suis retenu car je ne peux pas comprendre comment JSON.stringify () une Map. Il est garanti que mes clés sont des chaînes et mes valeurs seront toujours répertoriées. Dois-je vraiment écrire une méthode wrapper pour sérialiser?

Vous ne pouvez pas.

Les clés d'une carte peuvent être n'importe quoi, y compris des objets. Mais la syntaxe JSON n'autorise que les chaînes en tant que clés. C'est donc impossible dans un cas général.

Il est garanti que mes clés sont des chaînes et mes valeurs seront toujours des listes

Dans ce cas, vous pouvez utiliser un objet simple. Il aura ces avantages:

• Il pourra être stringifié en JSON.
• Cela fonctionnera sur les anciens navigateurs.
• Cela pourrait être plus rapide.

Vous ne pouvez pas directement stringifier l' Mapinstance car elle n'a aucune propriété, mais vous pouvez la convertir en un tableau de tuples:

jsonText = JSON.stringify(Array.from(map.entries()));

Pour l'inverse, utilisez

map = new Map(JSON.parse(jsonText));

Les deux JSON.stringifyet JSON.parsesoutiennent un deuxième argument. replaceret reviverrespectivement. Avec replacer et reviver ci-dessous, il est possible d'ajouter la prise en charge de l'objet Map natif, y compris des valeurs profondément imbriquées

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;
}

Utilisation :

const originalValue = new Map([['a', 1]]);
const str = JSON.stringify(originalValue, replacer);
const newValue = JSON.parse(str, reviver);
console.log(originalValue, newValue);

Imbrication profonde avec combinaison de tableaux, d'objets et de cartes

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);

Bien qu'il n'y ait pas encore de méthode fournie par ecmascript, cela peut toujours être fait en utilisant JSON.stingifysi vous mappez le Mapà une primitive JavaScript. Voici l'exemple que Mapnous utiliserons.

const map = new Map();
map.set('foo', 'bar');
map.set('baz', 'quz');

Accéder à un objet JavaScript

Vous pouvez convertir en littéral objet JavaScript avec la fonction d'assistance suivante.

const mapToObj = m => {
  return Array.from(m).reduce((obj, [key, value]) => {
    obj[key] = value;
    return obj;
  }, {});
};

JSON.stringify(mapToObj(map)); // '{"foo":"bar","baz":"quz"}'

Accéder à un tableau d'objets JavaScript

La fonction d'assistance pour celui-ci serait encore plus compacte

const mapToAoO = m => {
  return Array.from(m).map( ([k,v]) => {return {[k]:v}} );
};

JSON.stringify(mapToAoO(map)); // '[{"foo":"bar"},{"baz":"quz"}]'

Aller à Array of Arrays

C'est encore plus facile, vous pouvez simplement utiliser

JSON.stringify( Array.from(map) ); // '[["foo","bar"],["baz","quz"]]'

Utilisation de la sytaxe de propagation La carte peut être sérialisée sur une seule ligne:

JSON.stringify([...new Map()]);

et désérialisez-le avec:

let map = new Map(JSON.parse(map));

Stringifier une Mapinstance (les objets comme clés sont OK) :

JSON.stringify([...map])

ou

JSON.stringify(Array.from(map))

ou

JSON.stringify(Array.from(map.entries()))

format de sortie:

// [["key1","value1"],["key2","value2"]]

Une meilleure solution

    // 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);

Production

    > {
        "a": 1,
        "b": {
            "datum": true
        },
        "c": [
            1,
            2,
            3
        ],
        "d": {
            "e": true
        }
    }

J'espère que c'est moins grincheux que les réponses ci-dessus.

La solution ci-dessous fonctionne même si vous avez des cartes imbriquées

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);
}