Ciclo JavaScript attraverso json array?


151

Sto cercando di scorrere il seguente array JSON:

{
  "id": "1",
  "msg": "hi",
  "tid": "2013-05-05 23:35",
  "fromWho": "hello1@email.se"
}, {
  "id": "2",
  "msg": "there",
  "tid": "2013-05-05 23:45",
  "fromWho": "hello2@email.se"
}

E ho provato quanto segue

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

Ma per qualche ragione sto ottenendo solo la prima parte, i valori ID 1.

Qualche idea?


Ci sono alcune parentesi mancanti? Non sembra davvero un array, ora. E hai analizzato il JSON?
Denys Séguret,

è una matrice di oggetti? (ti stai perdendo [] o non ci sono?)
lpiepiora,

9
Non è né JSON né array.
JJJ


Per favore cambia il titolo, questo è per iterare attraverso le proprietà di un oggetto JSON, non un array
Taylored Web Sites

Risposte:


222

Il tuo JSON dovrebbe apparire così:

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

È possibile eseguire il ciclo sull'array in questo modo:

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

    console.log(obj.id);
}

O come questo (suggerito da Eric) fai attenzione con il supporto IE

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

11
O più concisamente,json.forEach(function(obj) { console.log(obj.id); });
Eric

4
A meno che su IE8 (come al solito, tutti tranne IE;))
lpiepiora

4
Penso che questo esempio possa essere confuso, perché var json non è un oggetto JSON, ma un array. In questo caso, .forEach funziona bene, ma quando si utilizza un oggetto json, non funziona.
mpoletto,

27

Ci sono alcuni problemi nel tuo codice, prima il tuo json deve apparire come:

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

Successivamente, puoi iterare in questo modo:

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

E dà un risultato perfetto.

Guarda il violino qui: http://jsfiddle.net/zrSmp/


16
var arr = [
  {
  "id": "1",
  "msg": "hi",
  "tid": "2013-05-05 23:35",
  "fromWho": "hello1@email.se"
  }, {
  "id": "2",
  "msg": "there",
  "tid": "2013-05-05 23:45",
  "fromWho": "hello2@email.se"
  }
];

Per ogni metodo per una facile implementazione.

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

16

prova questo

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

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

10

Da quando ho già iniziato a esaminarlo:

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

E questa funzione

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

Puoi chiamarlo così

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

Aggiornamento dopo il commento di Erics

Come ha sottolineato Eric , un for inloop per un array può avere risultati inaspettati . La domanda di riferimento ha una lunga discussione su pro e contro.

Prova con per (var i ...

Ma sembra che il seguito sia abbastanza salvo:

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

Anche se un test in Chrome ha avuto il seguente risultato

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

Prova con .forEach()

Almeno in Chrome 30 funziona come previsto

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

link


2
-1 - i for ... in loop non devono essere usati per gli array
Eric

Uso di comprensioni array for each. for ... in ...è un costrutto di linguaggio per enumerare le chiavi degli oggetti in un ordine arbitrario. Questo non è il costrutto giusto per un array.
Eric

9

Funziona. Ho appena aggiunto parentesi quadre ai dati JSON. I dati sono:

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

E il ciclo è:

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

6

Deve essere un array se si desidera iterare su di esso. Molto probabilmente ti manchi [e ].

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

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

Dai un'occhiata a questo jsfiddle: http://jsfiddle.net/lpiepiora/kN7yZ/


5

Un po 'in ritardo, ma spero di poter aiutare gli altri: D

il tuo json deve assomigliare a qualcosa che Niklas ha già detto. E poi eccoti qui:

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

se hai un array multidimensionale, questo è il tuo codice:

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

3

Bene, tutto quello che posso vedere è che hai due oggetti JSON, separati da una virgola. Se entrambi fossero all'interno di un array ( [...]) avrebbe più senso.

E, se SONO all'interno di un array, allora useresti solo il tipo standard di ciclo "for var i = 0 ...". Così com'è, penso che proverà a recuperare la proprietà "id" della stringa "1", quindi "id" di "hi" e così via.


2

Una breve soluzione che utilizza mape una funzione freccia

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

E per coprire i casi in cui la proprietà "id"non è presente utilizzare filter:

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

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


0

oh mio ... perché tutti lo rendono così difficile !!?

lo snippet di dati deve essere leggermente espanso e deve essere in questo modo per essere un vero json. notare che includo solo l'attributo del nome dell'array "item"

{"item":[
{
  "id": "1",
  "msg": "hi",
  "tid": "2013-05-05 23:35",
  "fromWho": "hello1@email.se"
}, {
  "id": "2",
  "msg": "there",
  "tid": "2013-05-05 23:45",
  "fromWho": "hello2@email.se"
}]}

il tuo script java è semplicemente

var objCount = json.item.length;
for ( var x=0; x < objCount ; xx++ ) {
    var curitem = json.item[x];
}
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.