web-dev-qa-db-fra.com

Boucle JavaScript dans un tableau JSON?

J'essaie de parcourir le tableau JSON suivant:

{
  "id": "1",
  "msg": "hi",
  "tid": "2013-05-05 23:35",
  "fromWho": "[email protected]"
}, {
  "id": "2",
  "msg": "there",
  "tid": "2013-05-05 23:45",
  "fromWho": "[email protected]"
}

Et ont essayé ce qui suit

for (var key in data) {
   if (data.hasOwnProperty(key)) {
      console.log(data[key].id);
   }
}

Mais pour une raison quelconque, je ne reçois que la première partie, les valeurs id 1.

Des idées?

javascriptjson
99
Alosyius

Votre JSON devrait ressembler à ceci:

var json = [{
    "id" : "1", 
    "msg"   : "hi",
    "tid" : "2013-05-05 23:35",
    "fromWho": "[email protected]"
},
{
    "id" : "2", 
    "msg"   : "there",
    "tid" : "2013-05-05 23:45",
    "fromWho": "[email protected]"
}];

Vous pouvez faire une boucle sur le tableau comme ceci:

for(var i = 0; i < json.length; i++) {
    var obj = json[i];

    console.log(obj.id);
}

Ou comme ceci (suggéré par Eric) soyez prudent avec le support de IE

json.forEach(function(obj) { console.log(obj.id); });
166
Niklas

Il y a quelques problèmes dans votre code, tout d'abord votre json doit ressembler à:

var json = [{
"id" : "1", 
"msg"   : "hi",
"tid" : "2013-05-05 23:35",
"fromWho": "[email protected]"
},
{
"id" : "2", 
"msg"   : "there",
"tid" : "2013-05-05 23:45",
"fromWho": "[email protected]"
}];

Ensuite, vous pouvez itérer comme ceci:

for (var key in json) {
if (json.hasOwnProperty(key)) {
  alert(json[key].id);
  alert(json[key].msg);
}
}

Et ça donne un résultat parfait.

Voir le violon ici: http://jsfiddle.net/zrSmp/

21
The Dark Knight

Depuis que j'ai déjà commencé à me renseigner:

var data = [{
    "id": "1",
    "msg": "hi",
    "tid": "2013-05-05 23:35",
    "fromWho": "[email protected]"
}, {
    "id": "2",
    "msg": "there",
    "tid": "2013-05-05 23:45",
    "fromWho": "[email protected]"
}]

Et cette fonction 

var iterateData =function(data){   for (var key in data) {
       if (data.hasOwnProperty(key)) {
          console.log(data[key].id);
       }
    }};

Vous pouvez l'appeler comme ça

iterateData(data); // write 1 and 2 to the console

Mise à jour après le commentaire Erics

Comme eric a souligné une boucle for in pour un tableau peut avoir des résultats inattendus . La question mentionnée a une longue discussion sur les avantages et les inconvénients. 

Testez avec (var i ...

Mais il semble que la suite soit assez sauve:

for(var i = 0; i < array.length; i += 1)

Bien qu'un test en chrome ait eu le résultat suivant

var ar = [];
ar[0] = "a"; 
ar[1] = "b";
ar[4] = "c";

function forInArray(ar){ 
     for(var i = 0; i < ar.length; i += 1) 
        console.log(ar[i]);
}

// calling the function
// returns a,b, undefined, undefined, c, undefined
forInArray(ar);

Test avec .forEach()

Au moins en chrome 30 cela fonctionne comme prévu

var logAr = function(element, index, array) {
    console.log("a[" + index + "] = " + element);
}
ar.forEach(logAr); // returns a[0] = a, a[1] = b, a[4] = c

Liens

8
surfmuggle
var arr = [
  {
  "id": "1",
  "msg": "hi",
  "tid": "2013-05-05 23:35",
  "fromWho": "[email protected]"
  }, {
  "id": "2",
  "msg": "there",
  "tid": "2013-05-05 23:45",
  "fromWho": "[email protected]"
  }
];

ForEach méthode pour une mise en œuvre facile. 

arr.forEach(function(item){
  console.log('ID: ' + item.id);
  console.log('MSG: ' + item.msg);
  console.log('TID: ' + item.tid);
  console.log('FROMWHO: ' + item.fromWho);
});
8
Sivanesh Fiz

Ce doit être un tableau si vous voulez le parcourir. Il est très probable que vous manquiez de [ et ].

var x = [{
    "id": "1",
        "msg": "hi",
        "tid": "2013-05-05 23:35",
        "fromWho": "[email protected]"
}, {
    "id": "2",
        "msg": "there",
        "tid": "2013-05-05 23:45",
        "fromWho": "[email protected]"
}];

var $output = $('#output');
for(var i = 0; i < x.length; i++) {
    console.log(x[i].id);
}

Découvrez ce jsfiddle: http://jsfiddle.net/lpiepiora/kN7yZ/

6
lpiepiora

Un peu en retard mais j'espère pouvoir aider les autres: D

votre message doit ressembler à quelque chose que Niklas a déjà dit. Et puis voila:

for(var key in currentObject){
        if(currentObject.hasOwnProperty(key)) {
          console.info(key + ': ' + currentObject[key]);
        }
   }

si vous avez un tableau multidimensionnel, voici votre code: 

for (var i = 0; i < multiDimensionalArray.length; i++) {
    var currentObject = multiDimensionalArray[i]
    for(var key in currentObject){
            if(currentObject.hasOwnProperty(key)) {
              console.info(key + ': ' + currentObject[key]);
            }
       }
}
5
Kami Yang

Ça fonctionne. Je viens d'ajouter des crochets aux données JSON. Les données sont:

var data = [
    { 
        "id": "1",
        "msg": "hi", 
        "tid": "2013-05-05 23:35", 
        "fromWho": "[email protected]" 
    }, 
    { 
        "id": "2", 
        "msg": "there", 
        "tid": "2013-05-05 23:45", 
        "fromWho": "[email protected]"
    }
]

Et la boucle est:

for (var key in data) {
   if (data.hasOwnProperty(key)) {
         alert(data[key].id);
   }
}
4
Shyam Shinde

Tout ce que je peux voir, c’est que vous avez deux objets JSON, séparés par une virgule. Si les deux se trouvaient dans un tableau ([...]), cela aurait plus de sens.

Et, s’ils se trouvent à l’intérieur d’un tableau, vous utiliseriez simplement le type de boucle standard "for var i = 0 ...". Dans l'état actuel des choses, je pense que nous allons essayer de récupérer la propriété "id" de la chaîne "1", puis "id" de "hi", etc.

2
Katana314

Une solution courte utilisant map et une fonction flèche

var data = [{
  "id": "1",
  "msg": "hi",
  "tid": "2013-05-05 23:35",
  "fromWho": "[email protected]"
}, {
  "id": "2",
  "msg": "there",
  "tid": "2013-05-05 23:45",
  "fromWho": "[email protected]"
}];
data.map((item, i) => console.log('Index:', i, 'Id:', item.id));

Et pour couvrir les cas où la propriété "id" n'est pas présente, utilisez filter :

var data = [{
  "id": "1",
  "msg": "hi",
  "tid": "2013-05-05 23:35",
  "fromWho": "[email protected]"
}, {
  "id": "2",
  "msg": "there",
  "tid": "2013-05-05 23:45",
  "fromWho": "[email protected]"
}, {
  "msg": "abcde",
  "tid": "2013-06-06 23:46",
  "fromWho": "[email protected]"
}];

data.filter(item=>item.hasOwnProperty('id'))
                .map((item, i) => console.log('Index:', i, 'Id:', item.id));

2
user2314737

essaye ça 

var json = [{
    "id" : "1", 
    "msg"   : "hi",
    "tid" : "2013-05-05 23:35",
    "fromWho": "[email protected]"
},
{
    "id" : "2", 
    "msg"   : "there",
    "tid" : "2013-05-05 23:45",
    "fromWho": "[email protected]"
}];

json.forEach((item) => {
  console.log('ID: ' + item.id);
  console.log('MSG: ' + item.msg);
  console.log('TID: ' + item.tid);
  console.log('FROMWHO: ' + item.fromWho);
});
0
chirag sorathiya