JSON ist ein Format zum Speichern und Transportieren von Daten.
JSON wird häufig verwendet, wenn Daten von einem Server an ein Web gesendet werden Seite.
JSON steht für JavaSscript Object notation
JSON ist ein leichtes Datenaustauschformat
JSON ist sprachunabhängig *
JSON ist „selbstbeschreibend“ und leicht zu verstehen
* Die JSON-Syntax ist von der JavaScript-Objektnotationssyntax abgeleitet, das JSON-Format besteht jedoch nur aus Text. Code zum Lesen und Generieren von JSON-Daten kann in jeder Programmierung geschrieben werden Sprache.
Diese JSON-Syntax definiert ein Mitarbeiterobjekt: ein Array aus 3 Mitarbeiterdatensätzen (Objekten):
{
"employees":[
{"firstName":"John", "lastName":"Doe"},
{"firstName":"Anna", "lastName":"Smith"},
{"firstName":"Peter", "lastName":"Jones"}
]
}
Das JSON-Format ist syntaktisch identisch mit dem Code zum Erstellen JavaScript-Objekte.
Aufgrund dieser Ähnlichkeit ein JavaScript-Programm kann JSON-Daten problemlos in native konvertieren JavaScript-Objekte.
Die Daten liegen in Name/Wert-Paaren vor
Die Daten werden durch Kommas getrennt
Geschweifte Klammern halten Gegenstände
Eckige Klammern enthalten Arrays
JSON-Daten werden wie JavaScript-Objekte als Name/Wert-Paare geschrieben Eigenschaften.
Ein Name/Wert-Paar besteht aus einem Feldnamen (in doppelten Anführungszeichen), gefolgt von einem Doppelpunkt, gefolgt von einem Wert:
"firstName":"John"
JSON-Namen erfordern doppelte Anführungszeichen. Bei JavaScript-Namen ist dies nicht der Fall.
JSON-Objekte werden in geschweifte Klammern geschrieben.
Genau wie in JavaScript können Objekte mehrere Name/Wert-Paare enthalten:
{"firstName":"John", "lastName":"Doe"}
JSON-Arrays werden in eckige Klammern geschrieben.
Genau wie in JavaScript kann ein Array Objekte enthalten:
"employees":[
{"firstName":"John", "lastName":"Doe"},
{"firstName":"Anna", "lastName":"Smith"},
{"firstName":"Peter", "lastName":"Jones"}
]
Im obigen Beispiel ist das Objekt „employees“ ein Array. Es enthält drei Objekte.
Jedes Objekt ist ein Datensatz einer Person (mit einem Vor- und einem Nachnamen).
Eine häufige Verwendung von JSON besteht darin, Daten von einem Webserver zu lesen. und die Daten auf einer Webseite anzeigen.
Der Einfachheit halber kann dies anhand einer Zeichenfolge als Eingabe demonstriert werden.
Erstellen Sie zunächst eine JavaScript-Zeichenfolge mit JSON-Syntax:
let text = '{ "employees" : [' +
'{ "firstName":"John" , "lastName":"Doe" },' +
'{ "firstName":"Anna" , "lastName":"Smith" },' +
'{ "firstName":"Peter" , "lastName":"Jones" } ]}';
Verwenden Sie dann die in JavaScript integrierte Funktion JSON.parse()
, um die Zeichenfolge in ein JavaScript-Objekt zu konvertieren:
const obj = JSON.parse(text);
Verwenden Sie abschließend das neue JavaScript-Objekt auf Ihrer Seite:
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
obj.employees[1].firstName + " " + obj.employees[1].lastName;
</script>
Probieren Sie es selbst aus →
<!DOCTYPE html>
<html>
<body>
<h2>Create Object from JSON String</h2>
<p id="demo"></p>
<script>
let text = '{"employees":[' +
'{"firstName":"John","lastName":"Doe" },' +
'{"firstName":"Anna","lastName":"Smith" },' +
'{"firstName":"Peter","lastName":"Jones" }]}';
const obj = JSON.parse(text);
document.getElementById("demo").innerHTML =
obj.employees[1].firstName + " " + obj.employees[1].lastName;
</script>
</body>
</html>
Weitere Informationen zu JSON finden Sie in unserem JSON-Tutorial.