Pętla JavaScript przez tablicę JSON?


151

Próbuję przejść przez następującą tablicę 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"
}

I wypróbowałem następujące rozwiązania

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

Ale z jakiegoś powodu otrzymuję tylko pierwszą część, wartości id 1.

Jakieś pomysły?


Czy brakuje jakichś nawiasów? Teraz tak naprawdę nie wygląda jak tablica. Czy przeanalizowałeś JSON?
— Denys Séguret

czy jest to tablica obiektów? (brakuje ci [] czy ich tam nie ma?)
— lpiepiora

9
To nie jest JSON ani tablica.
— JJJ


Zmień tytuł, ma to na celu iterację po właściwościach obiektu JSON, a nie tablicy
— Taylored Web Sites

Odpowiedzi:


222

Twój JSON powinien wyglądać tak:

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

Możesz wykonać pętlę po tablicy w następujący sposób:

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

    console.log(obj.id);
}

Lub w ten sposób (sugerowane przez Erica) bądź ostrożny z obsługą IE

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

11
Lub bardziej zwięźle,json.forEach(function(obj) { console.log(obj.id); });
— Eric

4
Chyba że na IE8 (jak zwykle wszyscy oprócz IE;))
— lpiepiora

4
Myślę, że ten przykład może być mylący, ponieważ var json nie jest obiektem JSON, ale tablicą. W tym przypadku .forEach działa dobrze, ale gdy używasz obiektu json, nie działa.
— mpoletto

27

W Twoim kodzie jest kilka problemów, najpierw Twój json musi wyglądać następująco:

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

Następnie możesz iterować w ten sposób:

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

I daje doskonały efekt.

Zobacz skrzypce tutaj: 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"
  }
];

forEach dla łatwej implementacji.

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

Spróbuj tego

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

Ponieważ już zacząłem się tym zajmować:

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

I ta funkcja

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

Możesz to tak nazwać

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

Aktualizacja po komentarzu Ericsa

Jak Eric wskazał pętla macierzy może nieoczekiwane rezultaty . Przywoływane pytanie zawiera długą dyskusję na temat zalet i wad.for in

Test z for (var i ...

Ale wygląda na to, że następująca sytuacja jest całkiem bezpieczna:

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

Chociaż test w chromie dał następujący wynik

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

Testuj z .forEach()

Przynajmniej w Chrome 30 działa to zgodnie z oczekiwaniami

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

Spinki do mankietów


2
-1 - for ... in pętle nie powinny być używane dla tablic
— Eric

Stosowanie wyrażeń tablicowych for each. for ... in ...jest konstrukcją językową służącą do wyliczania kluczy obiektów w dowolnej kolejności. To nie jest właściwa konstrukcja dla tablicy.
— Eric

9

To działa. Właśnie dodałem nawiasy kwadratowe do danych JSON. Dane to:

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

A pętla to:

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

6

Musi to być tablica, jeśli chcesz ją iterować. Najprawdopodobniej brakuje ci [i ].

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

Sprawdź to jsfiddle: http://jsfiddle.net/lpiepiora/kN7yZ/


5

Trochę późno, ale mam nadzieję, że pomogę innym: D

twój json musi wyglądać jak coś, co już powiedział Niklas. A potem zaczynasz:

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

jeśli masz tablicę wielowymiarową, to jest twój kod:

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

Widzę tylko, że masz dwa obiekty JSON oddzielone przecinkami. Gdyby obydwa znajdowały się wewnątrz tablicy ( [...]), miałoby to większy sens.

A jeśli SĄ one wewnątrz tablicy, używałbyś po prostu standardowej pętli typu „for var i = 0 ...”. W tej chwili wydaje mi się, że spróbuje pobrać właściwość „id” ciągu „1”, a następnie „id” z „hi” i tak dalej.


2

Krótkie rozwiązanie wykorzystujące mapi funkcję strzałki

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

Oraz w przypadkach, gdy nieruchomość "id"nie jest obecna, użyj 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

ojej ... dlaczego wszyscy tak to utrudniają !!?

Twój fragment danych musi zostać trochę rozszerzony i tak musi być, aby był poprawnym jsonem. zauważ, że po prostu dołączam atrybut nazwy tablicy „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"
}]}

Twój skrypt java jest po prostu

var objCount = json.item.length;
for ( var x=0; x < objCount ; xx++ ) {
    var curitem = json.item[x];
}
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.