Comment itérer (clés, valeurs) en javascript?


335

J'ai un dictionnaire au format

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

Comment puis-je parcourir ce dictionnaire en faisant quelque chose comme

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)), besoin de Babel.
elclanrs


1
@elclanrs C'est dans ES2016 et ce n'est pas encore standardisé :-)
thefourtheye

2
sdc

@dooagain, ce n'est pas un tableau dans cette question.
zangw

Réponses:


480

tl; dr

  1. Dans ECMAScript 5, ce n'est pas possible.
  2. Dans ECMAScript 2015, il est possible avec l' Mapart.
  3. Dans ECMAScript 2017, il serait facilement disponible.

ECMAScript 5:

Non, ce n'est pas possible avec des objets.

Vous devez soit répéter avec for..in, ou Object.keys, comme ceci

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

Remarque: La ifcondition ci-dessus est nécessaire, uniquement si vous souhaitez itérer les propriétés qui sont dictionaryles propres à l'objet. Parce que for..inva parcourir toutes les propriétés énumérables héritées.

Ou

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

ECMAScript 2015

Dans ECMAScript 2015, vous pouvez utiliser des Mapobjets et les itérer avec Map.prototype.entries. Citant l'exemple de cette page,

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"]

Ou répéter avec for..of, comme ça

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

Production

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

Ou

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

Production

0 foo
1 bar
{} baz

ECMAScript 2017

ECMAScript 2017 introduirait une nouvelle fonction Object.entries. Vous pouvez l'utiliser pour itérer l'objet comme vous le souhaitez.

'use strict';

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

Production

a 1
b 2
c 3

1
Un doute fondamental ici. J'ai atterri ici en cherchant comment faire cela dans node.js, qui est javascript côté serveur. Comment savoir quelle version ES s'applique dans mon cas. De plus, dans le cas d'utilisateurs réguliers de javascript, quelle est la bonne façon de prendre en charge si je comprends que la version ES dépend du navigateur du client?
Sandeepan Nath

2
@SandeepanNath Vous pouvez utiliser des sites Web comme node.green pour savoir si une fonction ES particulière est prise en charge dans votre Node.js. En ce qui concerne les navigateurs, les gens ciblent généralement la version qui est largement prise en charge, dans ce cas, ES5. En dehors de cela, les transpilers (comme Babel ) aident à convertir le code ES2015 + en ES5.
thefourtheye

1
J'aime Object.keys(dictionary).forEach(function(key) {…très lisible et compatible.
ctrl-alt-delor

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

La solution ECMAScript 2015 ci-dessus a lancé "TypeScript et Iterator: le type" IterableIterator <T> "n'est pas un type de tableau" mais tout simplement myMap (). Foreach () fonctionnait bien.
ttugates

60

Essaye ça:

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

La Object.entries()méthode a été spécifiée dans ES2017 (et est prise en charge dans tous les navigateurs modernes ):

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

Explication:

  • Object.entries()prend un objet comme { a: 1, b: 2, c: 3 }il se transforme en un réseau de paires de valeurs de clé: [ [ 'a', 1 ], [ 'b', 2 ], [ 'c', 3 ] ].

  • Avec for ... ofnous pouvons parcourir les entrées du tableau ainsi créé.

  • Puisque nous sommes garantis que chacun des éléments du tableau ainsi itéré est lui-même un tableau à deux entrées, nous pouvons utiliser la déstructuration pour affecter directement des variables keyet valueà ses premier et deuxième éléments.


Le plus triste, c'est que les gens utilisent toujours Internet Explorer
Edward

J'en suis douloureusement conscient. Babel et polyfill.io résolvent cela, mais c'est loin d'être agréable.
Loilo

19

Vous pouvez faire quelque chose comme ça:

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
Belle! J'adore le fonctionnement de votre réponse dans ECMAscript 5 malgré la réponse acceptée et la plus votée disant que ce n'est pas possible. Vous méritez tous beaucoup plus de votes positifs.
liljoshu

18

Essaye ça:

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

9

BIENVENUE EN 2020 * Drools dans ES6 *

Il y a des réponses assez anciennes ici - profitez de la déstructuration. À mon avis, c'est sans aucun doute la meilleure façon (très lisible) d'itérer un objet.

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

Juste une note: si vous remplacez forEachpar mapci-dessus, il est alors possible d'agréger les valeurs. maprenverra alors une liste desdites valeurs, simplifiant ainsi potentiellement le code par d'autres moyens.
Lazerbeak12345


1

en utilisant swagger-ui.js

tu peux le faire -

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

0

Vous pouvez utiliser le script ci-dessous.

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

sorties
1 a
2 b
c 3


#will output #c 3 # 1 a # 2 b
Michael Piper

4
Pensez à ajouter une explication à votre réponse, le code seul est moins utile. De plus, vous pouvez modifier votre réponse, les commentaires ne sont pas censés être une extension de la réponse dans la façon dont vous les utilisez
Viktor

0

Pour améliorer la réponse acceptée, afin de réduire l'imbrication, vous pouvez le faire à la place, à condition que la clé ne soit pas héritée:

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

Edit: info Object.hasOwnProperty ici

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.