Wie konvertiere ich Map-Schlüssel in ein Array?


235

Nehmen wir an, ich habe die folgende Karte:

let myMap = new Map().set('a', 1).set('b', 2);

Und ich möchte ['a', 'b'] basierend auf dem oben Gesagten erhalten. Meine derzeitige Lösung scheint so lang und schrecklich.

let myMap = new Map().set('a', 1).set('b', 2);
let keys = [];
for (let key of myMap)
  keys.push(key);
console.log(keys);

Es muss einen besseren Weg geben, nein?


17
Vielleicht Array.from(Map.keys()).
Dan D.


5
@gK. Es funktioniert nicht mit Map.
Pawel

@pawel Oh sorry dann!
Hamnix

Array.from(Map.values())- Wenn Sie für den Fall Werte anstelle von Schlüsseln benötigen.
Manohar Reddy Poreddy

Antworten:


431

Map.keys()Gibt ein MapIteratorObjekt zurück, das in Folgendes konvertiert Arraywerden kann Array.from:

let keys = Array.from( myMap.keys() );
// ["a", "b"]

BEARBEITEN: Sie können iterierbare Objekte auch mithilfe der Spread-Syntax in ein Array konvertieren

let keys =[ ...myMap.keys() ];
// ["a", "b"]

6
Ich mag die Verwendung des Spread-Operators, den mein TypeScript-Transpiler jedoch auslöst this.map.values().slice is not a function. Vielleicht sollte ich aktualisieren.
Cody

3
@Cody Das liegt daran, dass Ihr slice()Aufruf vor dem Spread-Operator ausgeführt wird. Versuchen Sie[ ... Array.from(map.values()).slice(0) ]
mgthomas99

5
TypeScript 2.7.2 sagt dazu const fooMap = new Map<number, string>(); const fooArray = [...fooMap.keys()];Folgendes: TS2461: Typ 'IterableIterator <Nummer>' ist kein Array-Typ. Dies ist in TypeScript also nicht zulässig. Array.from funktioniert wie erwartet.
Stefan Rein

Der @StefanRein Typescript-Spread-Operator sieht genauso aus, entspricht jedoch nicht dem ES6-Spread, da er nur mit Array- und Objekttypen funktioniert, während ES6 mit jedem iterierbaren Typ funktioniert. Sie können zB in ES6 ..."abc"einsteigen ["a","b","c"], was in TS nicht möglich ist.
Pawel

@pawel ..."abc"noch ...("abc")arbeiten in der Chrome-Konsole, die ES6 unterstützt?
Stefan Rein


6

Array.from(myMap.keys()) funktioniert nicht in Google-Anwendungsskripten.

Der Versuch, es zu verwenden, führt zu dem Fehler TypeError: Cannot find function from in object function Array() { [native code for Array.Array, arity=1] }.

Gehen Sie folgendermaßen vor, um eine Liste der Schlüssel in GAS zu erhalten:

var keysList = Object.keys(myMap);

Dieser funktioniert für mich und die erste Antwort nicht. Ich verwende Google nicht ... aber es wird immer wieder die Fehlermeldung map.keys()angezeigt, dass der Rückgabewert nicht iterierbar ist.
Azurespot

5

Ich brauche etwas Ähnliches mit eckiger reaktiver Form:

let myMap = new Map().set(0, {status: 'VALID'}).set(1, {status: 'INVALID'});
let mapToArray = Array.from(myMap.values());
let isValid = mapToArray.every(x => x.status === 'VALID');

2

Nicht gerade die beste Antwort auf die Frage, aber dieser Trick new Array(...someMap)hat mich ein paar Mal gerettet, wenn ich sowohl Schlüssel als auch Wert benötige, um das benötigte Array zu generieren. Zum Beispiel, wenn Reaktionskomponenten aus dem Map-Objekt basierend auf Schlüssel- und Wertwerten erstellt werden müssen.

  let map = new Map();
  map.set("1", 1);
  map.set("2", 2);
  console.log(new Array(...map).map(pairs => pairs[0])); -> ["1", "2"]

1

OK, lassen Sie uns etwas umfassender gehen und mit der Map für diejenigen beginnen, die diese Funktion in JavaScript nicht kennen ... MDN sagt:

Das Map-Objekt enthält Schlüssel-Wert-Paare und merkt sich die ursprüngliche Einfügereihenfolge der Schlüssel.
Jeder Wert (sowohl Objekte als auch primitive Werte) kann entweder als Schlüssel oder als Wert verwendet werden.

Wie Sie bereits erwähnt haben, können Sie ganz einfach eine Instanz von Map mit einem neuen Schlüsselwort erstellen ... In Ihrem Fall:

let myMap = new Map().set('a', 1).set('b', 2);

Also mal sehen ...

Die Art und Weise, wie Sie es erwähnt haben, ist in Ordnung, aber ja, es gibt präzisere Möglichkeiten, dies zu tun ...

Map verfügt über viele Methoden, die Sie verwenden können, z. B. set()die Sie bereits zum Zuweisen der Schlüsselwerte verwendet haben ...

Eine davon ist keys()die, die alle Schlüssel zurückgibt ...

In Ihrem Fall wird Folgendes zurückgegeben:

MapIterator {"a", "b"}

und Sie können sie einfach mithilfe von ES6- Methoden wie dem Spread-Operator in ein Array konvertieren ...

const b = [...myMap.keys()];
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.