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.