In diesem Tutorial lernen Sie anhand von Beispielen JSON und die Verwendung von JavaScript mit JSON kennen.
JSON steht für Javascript Object Notation. JSON ist ein textbasiertes Datenformat, das zum Speichern und Übertragen von Daten verwendet wird. Beispielsweise,
// JSON syntax ( "name": "John", "age": 22, "gender": "male", )
In JSON befinden sich die Daten in Schlüssel / Wert- Paaren, die durch ein Komma getrennt sind ,
.
JSON wurde von JavaScript abgeleitet. Die JSON-Syntax ähnelt also der JavaScript-Objektliteral-Syntax. Auf das JSON-Format kann jedoch auch von anderen Programmiersprachen zugegriffen und erstellt werden.
Hinweis : JavaScript-Objekte und JSON sind nicht identisch. Sie werden später in diesem Tutorial mehr über ihre Unterschiede erfahren.
JSON-Daten
JSON-Daten bestehen aus Schlüssel / Wert- Paaren, die den JavaScript-Objekteigenschaften ähneln. Der Schlüssel und die Werte werden in doppelte Anführungszeichen geschrieben, die durch einen Doppelpunkt getrennt sind :
. Beispielsweise,
// JSON data "name": "John"
Hinweis : Für JSON-Daten sind doppelte Anführungszeichen für den Schlüssel erforderlich.
JSON-Objekt
Das JSON-Objekt wird in geschweiften Klammern geschrieben ( )
. JSON-Objekte können mehrere Schlüssel / Wert- Paare enthalten. Beispielsweise,
// JSON object ( "name": "John", "age": 22 )
JSON-Array
Das JSON-Array wird in eckige Klammern geschrieben ( )
. Beispielsweise,
// JSON array ( "apple", "mango", "banana") // JSON array containing objects ( ( "name": "John", "age": 22 ), ( "name": "Peter", "age": 20 ). ( "name": "Mark", "age": 23 ) )
Hinweis : JSON-Daten können Objekte und Arrays enthalten. Im Gegensatz zu JavaScript-Objekten können JSON-Daten jedoch keine Funktionen als Werte enthalten.
Zugriff auf JSON-Daten
Sie können mit der Punktnotation auf JSON-Daten zugreifen. Beispielsweise,
// JSON object const data = ( "name": "John", "age": 22, "hobby": ( "reading" : true, "gaming" : false, "sport" : "football" ), "class" : ("JavaScript", "HTML", "CSS") ) // accessing JSON object console.log(data.name); // John console.log(data.hobby); // ( gaming: false, reading: true, sport: "football") console.log(data.hobby.sport); // football console.log(data.class(1)); // HTML
Wir verwenden die .
Notation, um auf JSON-Daten zuzugreifen. Die Syntax lautet:variableName.key
Sie können auch die Syntax ()
in eckigen Klammern verwenden, um auf JSON-Daten zuzugreifen. Beispielsweise,
// JSON object const data = ( "name": "John", "age": 22 ) // accessing JSON object console.log(data("name")); // John
JavaScript-Objekte VS JSON
Obwohl die Syntax von JSON dem JavaScript-Objekt ähnlich ist, unterscheidet sich JSON von JavaScript-Objekten.
JSON | JavaScript-Objekt |
---|---|
Der Schlüssel im Schlüssel / Wert-Paar sollte in doppelten Anführungszeichen stehen. | Der Schlüssel im Schlüssel / Wert-Paar kann ohne doppelte Anführungszeichen stehen. |
JSON kann keine Funktionen enthalten. | JavaScript-Objekte können Funktionen enthalten. |
JSON kann von anderen Programmiersprachen erstellt und verwendet werden. | JavaScript-Objekte können nur in JavaScript verwendet werden. |
Konvertieren von JSON in ein JavaScript-Objekt
Mit der integrierten JSON.parse()
Funktion können Sie JSON-Daten in ein JavaScript-Objekt konvertieren . Beispielsweise,
// json object const jsonData = '( "name": "John", "age": 22 )'; // converting to JavaScript object const obj = JSON.parse(jsonData); // accessing the data console.log(obj.name); // John
Konvertieren von JavaScript-Objekten in JSON
Sie können JavaScript-Objekte auch mithilfe der integrierten JavaScript- JSON.stringify()
Funktion in das JSON-Format konvertieren . Beispielsweise,
// JavaScript object const jsonData = ( "name": "John", "age": 22 ); // converting to JSON const obj = JSON.stringify(jsonData); // accessing the data console.log(obj); // "("name":"John","age":22)"
Verwendung von JSON
JSON ist das am häufigsten verwendete Format für die Übertragung von Daten (Datenaustausch) von einem Server zu einem Client und umgekehrt. JSON-Daten sind sehr einfach zu analysieren und zu verwenden. Der Zugriff auf und die Bearbeitung von JSON-Daten ist schnell, da sie nur Texte enthalten.
JSON ist sprachunabhängig. Sie können JSON auch in anderen Programmiersprachen erstellen und verwenden.