JSON w JavaScript

JSON to format przechowywania i przesyłania danych.

JSON jest często używany, gdy dane są przesyłane z serwera do strony internetowej.

Czym jest JSON?

  • JSON wskazuje na JavaScript Object Notation
  • JSON jest lekkim formatem wymiany danych
  • JSON jest niezależny od języka *
  • JSON jest "opisowym" i łatwy do zrozumienia

* Składnia JSON pochodzi z składni symboli obiektów JavaScript, ale format JSON jest czystym tekstem. Kod odczytywania i generowania danych JSON można napisać w dowolnym języku programowania.

Przykład JSON

Składnia JSON definiuje obiekt pracownika: tablicę zawierającą trzy zapisy pracowników (obiekty):

Przykład JSON

{
"employees":[
    {"firstName":"Bill", "lastName":"Gates"}, 
    {"firstName":"Steve", "lastName":"Jobs"},
    {"firstName":"Alan", "lastName":"Turing"}
]
}

Format JSON jest oceniany jako obiekt JavaScript

Format JSON jest gramatycznie identyczny z kodem tworzącym obiekty JavaScript.

Dzięki tej podobności, programy JavaScript mogą łatwo przekształcić dane JSON w lokalne obiekty JavaScript.

Zasady składni JSON

  • Dane są pary nazwa/wartość
  • Dane są rozdzielone przecinkami
  • Nawiasy klamrowe zapisują obiekty
  • Nawiasy kwadratowe zapisują tablice

Dane JSON - nazwy i wartości

Dane JSON są zapisywane w formie nazwa/wartość, podobnie jak atrybuty obiektu JavaScript.

Pary nazwa/wartość są zbudowane z nazwy (w cudzysłowie), po której następuje dwukropek, a następnie wartość:

"firstName":"Bill"

Nazwy JSON muszą być w cudzysłowie. Nazwy w JavaScriptie nie wymagają tego.

Obiekt JSON

Obiekty JSON są zapisywane w nawiasach klamrowych.

Podobnie jak w JavaScript, obiekty mogą zawierać wiele par nazwa/wartość:

{"firstName":"Bill", "lastName":"Gates"}

Tablica JSON

Tablice JSON są zapisywane w nawiasach kwadratowych.

Podobnie jak w JavaScript, tablice mogą zawierać obiekty:

"employees":[
    {"firstName":"Bill", "lastName":"Gates"}, 
    {"firstName":"Steve", "lastName":"Jobs"}, 
    {"firstName":"Alan", "lastName":"Turing"}
]

W powyższym przykładzie, obiekt "employees" jest tablicą. Zawiera trzy obiekty.

Każdy obiekt reprezentuje jedno zapisy osobowe (z imieniem i nazwiskiem).

Konwersja tekstu JSON na obiekt JavaScript

Zwykle użycie JSON obejmuje odczytywanie danych z serwera internetowego i wyświetlanie danych na stronie internetowej.

Dla uproszczenia, możemy użyć ciągu znaków jako przykładu wejściowego.

Najpierw, utwórzmy ciąg znaków JavaScript w formacie JSON:

var text = '{ "employees" : [
'{ "firstName":"Bill" , "lastName":"Gates" },' +
'{ "firstName":"Steve" , "lastName":"Jobs" },' +
'{ "firstName":"Alan" , "lastName":"Turing" } ]}';

Następnie, użyj wbudowanej funkcji JSON.parse() w JavaScript, aby przekształcić ten ciąg znaków w obiekt JavaScript:

var obj = JSON.parse(text);

Ostatecznie, użyj nowego obiektu JavaScript w swojej stronie:

Przykład

<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
obj.employees[1].firstName + " " + obj.employees[1].lastName;
</script>

Spróbuj sam

Możesz spróbować sam: Tutorial JSON Czytaj więcej o JSON w języku polskim.