Wie iteriere (Schlüssel, Werte) in Javascript?


335

Ich habe ein Wörterbuch, das das Format hat

dictionary = {0: {object}, 1:{object}, 2:{object}}

Wie kann ich dieses Wörterbuch durchlaufen, indem ich so etwas mache?

for((key,value) in dictionary){
  //Do stuff where key would be 0 and value would be the object
}

3
for (let [key, value] of Object.entries(obj))brauche Babel.
elclanrs


1
@elclanrs Es ist in ES2016 und es ist noch nicht standardisiert :-)
thefourtheye

2

@dooagain, es ist kein Array in dieser Frage.
Zangw

Antworten:


479

tl; dr

  1. In ECMAScript 5 ist dies nicht möglich.
  2. In ECMAScript 2015 ist dies mit Maps möglich .
  3. In ECMAScript 2017 wäre es leicht verfügbar.

ECMAScript 5:

Nein, mit Objekten ist das nicht möglich.

Sie sollten entweder mit for..inoder Object.keyswie folgt iterieren

for (var key in dictionary) {
    // check if the property/key is defined in the object itself, not in parent
    if (dictionary.hasOwnProperty(key)) {           
        console.log(key, dictionary[key]);
    }
}

Hinweis: Die ifobige Bedingung ist nur erforderlich, wenn Sie die Eigenschaften des dictionaryObjekts wiederholen möchten . Denn for..indurchläuft alle geerbten aufzählbaren Eigenschaften.

Oder

Object.keys(dictionary).forEach(function(key) {
    console.log(key, dictionary[key]);
});

ECMAScript 2015

In ECMAScript 2015 können Sie MapObjekte verwenden und mit ihnen iterieren Map.prototype.entries. Zitat Beispiel von dieser Seite,

var myMap = new Map();
myMap.set("0", "foo");
myMap.set(1, "bar");
myMap.set({}, "baz");

var mapIter = myMap.entries();

console.log(mapIter.next().value); // ["0", "foo"]
console.log(mapIter.next().value); // [1, "bar"]
console.log(mapIter.next().value); // [Object, "baz"]

Oder iterieren Sie mit for..ofso

'use strict';

var myMap = new Map();
myMap.set("0", "foo");
myMap.set(1, "bar");
myMap.set({}, "baz");

for (const entry of myMap.entries()) {
  console.log(entry);
}

Ausgabe

[ '0', 'foo' ]
[ 1, 'bar' ]
[ {}, 'baz' ]

Oder

for (const [key, value] of myMap.entries()) {
  console.log(key, value);
}

Ausgabe

0 foo
1 bar
{} baz

ECMAScript 2017

ECMAScript 2017 würde eine neue Funktion einführen Object.entries. Sie können dies verwenden, um das Objekt wie gewünscht zu iterieren.

'use strict';

const object = {'a': 1, 'b': 2, 'c' : 3};
for (const [key, value] of Object.entries(object)) {
  console.log(key, value);
}

Ausgabe

a 1
b 2
c 3

1
Ein grundlegender Zweifel hier. Ich bin hier gelandet und habe gesucht, wie das in node.js geht, das auf der Serverseite Javascript ist. Woher weiß ich, welche ES-Version in meinem Fall gilt? Was ist bei normalen Javascript-Benutzern der richtige Weg, um zu unterstützen, da ich verstehe, dass die ES-Version vom Browser des Clients abhängt?
Sandeepan Nath

2
@SandeepanNath Sie können Websites wie node.green verwenden , um festzustellen , ob eine bestimmte ES-Funktion in Ihrer Node.js unterstützt wird. In Bezug auf Browser zielen die Benutzer im Allgemeinen auf die Version ab, die weitgehend unterstützt wird, in diesem Fall ES5. Abgesehen davon helfen Transpiler (wie Babel ) bei der Konvertierung von ES2015 + -Code in ES5.
thefourtheye

1
Ich mag Object.keys(dictionary).forEach(function(key) {…sehr lesbar und kompatibel.
Strg-Alt-Delor

5
Object.entries(object).forEach(([key, val]) => {...});
Krimson

Die obige ECMAScript 2015-Lösung warf "TypeScript und Iterator: Typ 'IterableIterator <T>' ist kein Array-Typ", aber einfach ol myMap (). Foreach () funktionierte gut.
ttugates

60

Versuche dies:

dict = {0:{1:'a'}, 1:{2:'b'}, 2:{3:'c'}}
for (var key in dict){
  console.log( key, dict[key] );
}

0 Object { 1="a"}
1 Object { 2="b"}
2 Object { 3="c"}

42

Die Object.entries()Methode wurde in ES2017 angegeben (und wird in allen modernen Browsern unterstützt ):

for (const [ key, value ] of Object.entries(dictionary)) {
    // do something with `key` and `value`
}

Erläuterung:

  • Object.entries()nimmt ein Objekt wie { a: 1, b: 2, c: 3 }und verwandelt es in ein Array von Schlüssel-Wert-Paaren : [ [ 'a', 1 ], [ 'b', 2 ], [ 'c', 3 ] ].

  • Mit können for ... ofwir die Einträge des so erstellten Arrays durchlaufen.

  • Da wir garantiert haben, dass jedes der so iterierten Array-Elemente selbst ein Array mit zwei Einträgen ist, können wir die Destrukturierung verwenden , um Variablen keyund valueseinem ersten und zweiten Element direkt zuzuweisen .


Das Traurige ist, dass die Leute immer noch den Internet Explorer benutzen
Edward

Ich bin mir schmerzlich bewusst. Babel und polyfill.io lösen das, aber es macht alles andere als Spaß.
Loilo

19

Sie können so etwas tun:

dictionary = {'ab': {object}, 'cd':{object}, 'ef':{object}}
var keys = Object.keys(dictionary);

for(var i = 0; i < keys.length;i++){
   //keys[i] for key
   //dictionary[keys[i]] for the value
}

3
Wunderschönen! Ich finde es toll, wie Ihre Antwort in ECMAscript 5 funktioniert, obwohl die akzeptierte und am besten bewertete Antwort besagt, dass dies nicht möglich ist. Sie verdienen alle viel mehr Stimmen.
Liljoshu

18

Versuche dies:

var value;
for (var key in dictionary) {
    value = dictionary[key];
    // your code here...
}

9

WILLKOMMEN IM JAHR 2020 * Sabbern in ES6 *

Hier gibt es einige ziemlich alte Antworten - nutzen Sie die Destrukturierung. Meiner Meinung nach ist dies ohne Zweifel die schönste (sehr lesbare) Möglichkeit, ein Objekt zu iterieren.

Object.entries(myObject).forEach(([k,v]) => {
    console.log("The key: ",k)
    console.log("The value: ",v)
})

Nur ein Hinweis: Wenn Sie ersetzen forEachmit mapoben, ist es dann möglich, aggregierte Werte. mapgibt dann eine Liste dieser Werte zurück, wodurch der Code möglicherweise auf andere Weise vereinfacht wird.
Lazerbeak12345


1

mit swagger-ui.js

du kannst das -

_.forEach({ 'a': 1, 'b': 2 }, function(n, key) {
    console.log(n, key);
 });

0

Sie können das folgende Skript verwenden.

var obj={1:"a",2:"b",c:"3"};
for (var x=Object.keys(obj),i=0;i<x.length,key=x[i],value=obj[key];i++){
    console.log(key,value);
}

Ausgänge
1 a
2 b
c 3


# wird #c 3 # 1 a # 2 b ausgeben
Michael Piper

4
Erwägen Sie, Ihrer Antwort eine Erklärung hinzuzufügen. Code allein ist weniger hilfreich. Sie können Ihre Antwort auch bearbeiten. Kommentare sind keine Erweiterung der Antwort in der Art, wie Sie sie verwenden
Viktor

0

Als Verbesserung der akzeptierten Antwort können Sie stattdessen die Verschachtelung reduzieren, sofern der Schlüssel nicht vererbt wird:

for (var key in dictionary) {
    if (!dictionary.hasOwnProperty(key)) {
        continue;
    }
    console.log(key, dictionary[key]);
}

Edit: Infos Object.hasOwnProperty hier

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.