Javascript zum Parsen von JSON-Arrays


91

Ich verwende Sencha Touch (ExtJS), um eine JSON-Nachricht vom Server zu erhalten. Die Nachricht, die ich erhalte, ist folgende:

{
"success": true,
"counters": [
    {
        "counter_name": "dsd",
        "counter_type": "sds",
        "counter_unit": "sds"
    },
    {
        "counter_name": "gdg",
        "counter_type": "dfd",
        "counter_unit": "ds"
    },
    {
        "counter_name": "sdsData",
        "counter_type": "sds",
        "counter_unit": "   dd       "
    },
    {
        "counter_name": "Stoc final",
        "counter_type": "number    ",
        "counter_unit": "litri     "
    },
    {
        "counter_name": "Consum GPL",
        "counter_type": "number    ",
        "counter_unit": "litri     "
    },
    {
        "counter_name": "sdg",
        "counter_type": "dfg",
        "counter_unit": "gfgd"
    },
    {
        "counter_name": "dfgd",
        "counter_type": "fgf",
        "counter_unit": "liggtggggri     "
    },
    {
        "counter_name": "fgd",
        "counter_type": "dfg",
        "counter_unit": "kwfgf       "
    },
    {
        "counter_name": "dfg",
        "counter_type": "dfg",
        "counter_unit": "dg"
    },
    {
        "counter_name": "gd",
        "counter_type": "dfg",
        "counter_unit": "dfg"
    }

    ]
}

Mein Problem ist, dass ich dieses JSON-Objekt nicht analysieren kann, damit ich jedes der Zählerobjekte verwenden kann.

Ich versuche das so zu erreichen:

var jsonData = Ext.util.JSON.decode(myMessage);
for (var counter in jsonData.counters) {
     console.log(counter.counter_name);
 }

Was mache ich falsch ? Danke dir!


1
Mögliches Duplikat von
Sicheres Verwandeln

Antworten:


139

Javascript hat eine eingebaute JSON-Analyse für Zeichenfolgen, die Sie meiner Meinung nach haben:

var myObject = JSON.parse("my json string");

Dies mit Ihrem Beispiel zu verwenden wäre:

var jsonData = JSON.parse(myMessage);
for (var i = 0; i < jsonData.counters.length; i++) {
    var counter = jsonData.counters[i];
    console.log(counter.counter_name);
}

Hier ist ein Arbeitsbeispiel

BEARBEITEN : Es gibt einen Fehler bei der Verwendung der for-Schleife (ich habe dies beim ersten Lesen verpasst, danke an @Evert für den Spot). Bei Verwendung einer For-In-Schleife wird die Variable als Eigenschaftsname der aktuellen Schleife und nicht als tatsächliche Daten festgelegt. Siehe meine aktualisierte Schleife oben für die korrekte Verwendung

WICHTIG : Die JSON.parseMethode funktioniert in alten, alten Browsern nicht. Wenn Sie also vorhaben, Ihre Website über eine zeitlich begrenzte Internetverbindung verfügbar zu machen, kann dies ein Problem sein! Wenn Sie jedoch wirklich interessiert sind, finden Sie hier eine Support-Tabelle (die alle meine Kästchen ankreuzt).


1
Wenn er eine Bibliothek verwendet, die eine browserübergreifende parseJSON-Funktion unterstützt, sollte er diese verwenden. Außerdem wiederholen Sie den Schleifenfehler.
Bergi

Ich erhalte einen Fehler in der ersten Zeile, wenn ich Folgendes ausführe: Ungefangener Syntaxfehler: Unerwartetes Token o
Nächte

@nights: Das ist höchstwahrscheinlich, dass Sie eine ungültige JSON-Zeichenfolge haben. Versuchen Sie es mit einem Online-JSON-Validierungstool wie diesem
musefan

8

Das ist meine Antwort,

<!DOCTYPE html>
<html>
<body>
<h2>Create Object from JSON String</h2>
<p>
First Name: <span id="fname"></span><br> 
Last Name: <span id="lname"></span><br> 
</p> 
<script>
var txt = '{"employees":[' +
'{"firstName":"John","lastName":"Doe" },' +
'{"firstName":"Anna","lastName":"Smith" },' +
'{"firstName":"Peter","lastName":"Jones" }]}';

//var jsonData = eval ("(" + txt + ")");
var jsonData = JSON.parse(txt);
for (var i = 0; i < jsonData.employees.length; i++) {
    var counter = jsonData.employees[i];
    //console.log(counter.counter_name);
    alert(counter.firstName);
}

</script>
</body>
</html>

6

In einer for-in-Schleife enthält die laufende Variable den Eigenschaftsnamen und nicht den Eigenschaftswert.

for (var counter in jsonData.counters) {
    console.log(jsonData.counters[counter].counter_name);
}

Da Zähler ein Array sind, müssen Sie eine normale for-Schleife verwenden:

for (var i=0; i<jsonData.counters.length; i++) {
    var counter = jsonData.counters[i];
    console.log(counter.counter_name);
}

1

"Sencha way" für die Interaktion mit Serverdaten ist das Einrichten eines Ext.data.StoreProxys, der von einem Ext.data.proxy.Proxy(in diesem Fall Ext.data.proxy.Ajax) mit einem Proxy Ext.data.reader.Json(für JSON-codierte Daten sind auch andere Lesegeräte verfügbar) eingerichtet wird. Zum Zurückschreiben von Daten auf den Server gibt es Ext.data.writer.Writerverschiedene Arten.

Hier ist ein Beispiel für ein solches Setup:

    var store = Ext.create('Ext.data.Store', {
        fields: [
            'counter_name',
            'counter_type',
            'counter_unit'
        ],

        proxy: {
            type: 'ajax',
            url: 'data1.json',

            reader: {
                type: 'json',
                idProperty: 'counter_name',
                rootProperty: 'counters'
            }
        }
    });

data1.jsonIn diesem Beispiel (auch in dieser Geige verfügbar ) sind Ihre Daten wörtlich enthalten. idProperty: 'counter_name'ist in diesem Fall wahrscheinlich optional, zeigt jedoch normalerweise auf das Primärschlüsselattribut. rootProperty: 'counters'Gibt an, welche Eigenschaft ein Array von Datenelementen enthält.

Mit einem Store-Setup auf diese Weise können Sie Daten vom Server erneut lesen, indem Sie anrufen store.load(). Sie können den Store auch mit beliebigen Sencha Touch-geeigneten UI-Komponenten wie Rastern, Listen oder Formularen verbinden.



0

Das funktioniert wie Charme!

Also habe ich den Code gemäß meinen Anforderungen bearbeitet. Und hier sind die Änderungen: Es wird die ID-Nummer aus der Antwort in der Umgebungsvariablen gespeichert.

var jsonData = JSON.parse(responseBody);
for (var i = 0; i < jsonData.data.length; i++)
{
    var counter = jsonData.data[i];
    postman.setEnvironmentVariable("schID", counter.id);
}

0

Die Antwort mit der höheren Stimme hat einen Fehler. Wenn ich es benutzt habe, finde ich es in Zeile 3 heraus:

var counter = jsonData.counters[i];

Ich habe es geändert in:

var counter = jsonData[i].counters;

und es hat bei mir funktioniert. Es gibt einen Unterschied zu den anderen Antworten in Zeile 3:

var jsonData = JSON.parse(myMessage);
for (var i = 0; i < jsonData.counters.length; i++) {
    var counter = jsonData[i].counters;
    console.log(counter.counter_name);
}

1
Vielleicht meinst du können, wo du gesagt hast sollte . Es ist jedoch besser, wenn Sie Ihrem Code weitere Details / Erklärungen hinzufügen, um OP und anderen Personen mit derselben Frage besser zu helfen.
Tiw

Sie können auch ein wenig erklären, warum Sie diese Methode gewählt haben, damit der Benutzer etwas mehr lernt. Das würde helfen, diese Antwort zu verbessern.
TsTeaTime

Die Antwort mit den meisten Stimmen beantwortete diese Frage, aber wenn ich sie verwende, ist sie in Zeile 4 falsch: var counter = jsonData.counters [i]; Aber ich ändere es in: var counter = jsonData [i] .counters; und es hat funktioniert. also sagte ich kann statt sollte.
Mahdi Jalali

0

Nur als Heads-up ...

var data = JSON.parse(responseBody);

wurde veraltet .

Das Postman Learning Center schlägt jetzt vor

var jsonData = pm.response.json();

-1

Sie sollten einen Datenspeicher und einen Proxy in ExtJs verwenden. Es gibt viele Beispiele dafür, und der JSON-Reader analysiert die JSON-Nachricht automatisch in das von Ihnen angegebene Modell.

Bei der Verwendung von ExtJs muss kein grundlegendes Javascript verwendet werden. Alles ist anders. Sie sollten die ExtJs-Methoden verwenden, um alles richtig zu machen. Lesen Sie die Dokumentation sorgfältig durch, es ist gut.

Diese Beispiele gelten übrigens auch für Sencha Touch (insbesondere v2), das auf denselben Kernfunktionen wie ExtJs basiert.


-1

Ich bin mir nicht sicher, ob meine Daten genau übereinstimmen, aber ich hatte ein Array von Arrays von JSON-Objekten, die bei Verwendung von Seiten aus jQuery FormBuilder exportiert wurden.

Hoffentlich kann meine Antwort jedem helfen, der auf diese Frage stößt und nach einer Antwort auf ein Problem sucht, das meinem ähnlich ist.

Die Daten sahen ungefähr so ​​aus:

var allData = 
[
    [
        {
            "type":"text",
            "label":"Text Field"
        }, 
        {
            "type":"text",
            "label":"Text Field"
        }
    ],
    [
        {
            "type":"text",
            "label":"Text Field"
        }, 
        {
            "type":"text",
            "label":"Text Field"
        }
    ]
]

Um dies zu analysieren, habe ich einfach Folgendes getan:

JSON.parse("["+allData.toString()+"]")
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.