Verwendung von JSON-Daten in JavaScript_Javascript-Tipps

JSON ist ein natives JavaScript-Format, was bedeutet, dass für die Verarbeitung von JSON-Daten in JavaScript keine spezielle API oder Toolkit erforderlich ist.

JSON-Syntax

JSON besteht aus zwei Strukturen:

Objekt – eine Sammlung von Name/Wert-Paaren. In verschiedenen Sprachen wird es als Objekt, Datensatz, Struktur, Wörterbuch, Hash-Tabelle, Schlüsselliste oder assoziatives Array verstanden. Ein Objekt beginnt mit „{“ (linke Klammer) und endet mit „}“ (rechte Klammer). Auf jeden „Namen“ folgt ein „:“ (Doppelpunkt); „Name/Wert“-Paare werden durch ein „“, (Komma) getrennt.

Array – Eine geordnete Liste von Werten. In den meisten Sprachen wird es als Array verstanden. Ein Array beginnt mit „[“ (linke Klammer) und endet mit „]“ (rechte Klammer). Werte werden durch "," (Komma) getrennt.

JSON hat keine Variablen oder andere Kontrollstrukturen. JSON wird nur zur Datenübertragung verwendet.

JSON-Daten Variablen zuweisen

Sie können beispielsweise eine neue JavaScript-Variable erstellen und ihr direkt einen JSON-formatierten Datenstring zuweisen:

var people =
{ "programmers": [
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "brett@newInstance.com" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "jason@servlets.com" },
{ "firstName": "Elliotte", "lastName":"Harold", "email": "elharo@macfaq.com" }
],
"authors": [
{ "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" },
{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" },
{ "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" }
],
"musicians": [
{ "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" },
{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" }
]
}

Das ist sehr einfach; jetzt enthält People die Daten im JSON-Format, das wir zuvor gesehen haben. Dies reicht jedoch nicht aus, da der Weg zum Zugriff auf die Daten noch nicht klar zu sein scheint.

Zugangsdaten

Obwohl es nicht offensichtlich erscheint, handelt es sich bei der langen Zeichenfolge oben tatsächlich nur um ein Array. Sie können problemlos auf dieses Array zugreifen, indem Sie es in eine JavaScript-Variable einfügen. Tatsächlich verwenden Sie einfach die Punktnotation, um Array-Elemente darzustellen. Um also auf den Nachnamen des ersten Eintrags in der Programmiererliste zuzugreifen, verwenden Sie einfach Code wie diesen in JavaScript:

people.programmers[0].lastName;

Beachten Sie, dass die Array-Indizierung nullbasiert ist. Diese Codezeile greift also zunächst auf die Daten in der Variablen „people“ zu, wechselt dann zum Eintrag „programmers“, wechselt dann zum ersten Datensatz ([0]) und greift schließlich auf den Wert des Schlüssels „lastName“ zu. Das Ergebnis ist der String-Wert „McLaughlin“.

Hier sind einige Beispiele, die dieselbe Variable verwenden.

people.authors[1].genre 
// Value is "fantasy"
people.musicians[3].lastName 
// Undefined. This refers to the fourth entry,and there isn't one
people.programmers[2].firstName 
// Value is "Elliotte"

Mit dieser Syntax können alle Daten im JSON-Format verarbeitet werden, ohne dass ein zusätzliches JavaScript-Toolkit oder eine zusätzliche API verwendet werden muss.

JSON-Daten ändern

So wie auf Daten mithilfe von Punkten und Klammern zugegriffen werden kann, können Daten auf die gleiche Weise leicht geändert werden:

people.musicians[1].lastName = "Rachmaninov";

Nachdem Sie die Zeichenfolge in ein Objekt im JavaScript-JSON-Format konvertiert haben, können Sie die Daten in der Variablen wie folgt ändern.

Hinweis: Objekte im JSON-Format und JSON-Text sind unterschiedlich

var obj={name:" 张三 ","sex":' 男 '}; //json 格式的对象
var str=" { name: " 张三 " , "sex" : ' 男 ' }" ; //json 格式的字符串（ json 格式的文本）

Zurück in String konvertieren

Natürlich sind alle Datenänderungen von geringem Wert, wenn Sie das Objekt nicht einfach wieder in das in diesem Artikel erwähnte Textformat konvertieren können. Diese Konvertierung ist auch in JavaScript einfach:

var newJSONtext = people.toJSONString();

Das ist es! Sie verfügen nun über eine Textzeichenfolge, die Sie überall verwenden können, beispielsweise als Anforderungszeichenfolge in einer Ajax-Anwendung.

Noch wichtiger ist, dass jedes JavaScript-Objekt in JSON-Text konvertiert werden kann. Es ist nicht nur möglich, Variablen zu verarbeiten, die ursprünglich mit JSON-Strings zugewiesen wurden. Um ein Objekt mit dem Namen myObject zu konvertieren, führen Sie einfach einen Befehl derselben Form aus:

<script type="text/javascript">
function Car(make,model,year,color)
{
this.make=make; 
this.model=model; 
this.year=year; 
this.color=color;
} 
function showCar()
{
var carr = new Car("Dodge","Coronet R/T",1968,"yellow"); 
alert(carr.toJSONString()); 
}
</script>

Das ist der größte Unterschied zwischen JSON und anderen Datenformaten. Wenn Sie JSON verwenden, müssen Sie nur eine einfache Funktion aufrufen, um die formatierten Daten zu erhalten, die sofort verwendet werden können. Für andere Datenformate ist eine Konvertierung zwischen Rohdaten und formatierten Daten erforderlich. Selbst wenn Sie eine API wie das Document Object Model (das Funktionen zum Konvertieren Ihrer eigenen Datenstrukturen in Text bereitstellt) verwenden, müssen Sie die API erlernen und die Objekte der API verwenden, anstatt native JavaScript-Objekte und -Syntax zu verwenden.

Die abschließende Schlussfolgerung lautet: Wenn Sie mit einer großen Anzahl von JavaScript-Objekten arbeiten, ist JSON mit ziemlicher Sicherheit eine gute Wahl, damit Sie die Daten problemlos in ein Format konvertieren können, das an das serverseitige Programm gesendet werden kann die Anfrage (Ajax).

Methode zum Konvertieren einer JSON-Zeichenfolge in ein JSON-Objekt

Um den oben genannten str1 zu verwenden, müssen Sie ihn zunächst mit der folgenden Methode in ein JSON-Objekt konvertieren:

//由JSON字符串转换为JSON对象
var obj = eval('(' + str + ')');

oder

var obj = str.parseJSON(); //由JSON字符串转换为JSON对象

oder

var obj = JSON.parse(str); //由JSON字符串转换为JSON对象

Dann können Sie es so lesen:

Alert(obj.name);
Alert(obj.sex);

Besonderer Hinweis: Wenn obj ursprünglich ein JSON-Objekt ist, bleibt es nach der Konvertierung mit der Funktion eval() immer noch ein JSON-Objekt (auch wenn es mehrmals konvertiert wird), nach der Verwendung treten jedoch Probleme auf parseJSON()-Funktion verwenden, um es zu verarbeiten (was eine Syntaxausnahme auslöst).