Literály JSON

Obsah

    Zobrazit obsah

Toto je řetězec JSON:

'{"name":"John", "age":30, "car":null}'

Uvnitř řetězce JSON je doslovný objekt JSON:

{"name":"John", "age":30, "car":null}

Literály objektu JSON jsou ohraničeny složenými závorkami {}.

Literály objektu JSON obsahují páry klíč/hodnota.

Klíče a hodnoty jsou odděleny dvojtečkou.

Klíče musí být řetězce, a hodnoty musí být platný datový typ JSON:

  • řetězec
  • číslo
  • objekt
  • pole
  • logická hodnota
  • null

Každý pár klíč/hodnota je oddělen čárkou.

Je běžnou chybou nazývat objekt JSON doslovným „objektem JSON“.

JSON nemůže být objekt. JSON je formát řetězce.

Data jsou pouze JSON, když jsou ve formátu řetězce. Když je převedena na proměnnou JavaScriptu, stane se objektem JavaScriptu.

Objekty JavaScriptu

Objekt JavaScript můžete vytvořit z literálu objektu JSON:

Příklad

myObj = {"name":"John", "age":30, "car":null};

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>Creating an Object from a JSON Literal</h2>
<p id="demo"></p>

<script>
const myObj = {"name":"John", "age":30, "car":null};
document.getElementById("demo").innerHTML = myObj.name;
</script>

</body>
</html>

Normálně vytvoříte objekt JavaScriptu analýzou řetězce JSON:

Příklad

myJSON = '{"name":"John", "age":30, "car":null}';
myObj = JSON.parse(myJSON);

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>Creating an Object Parsing JSON</h2>
<p id="demo"></p>

<script>
const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);
document.getElementById("demo").innerHTML = myObj.name;
</script>

</body>
</html>

Přístup k hodnotám objektů

K hodnotám objektů můžete přistupovat pomocí notace s tečkami (.):

Příklad

const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);
  x = myObj.name;

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>Access a JavaScript Object</h2>
<p id="demo"></p>

<script>
const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);
document.getElementById("demo").innerHTML = myObj.name;
</script>

</body>
</html>

K hodnotám objektů můžete také přistupovat pomocí zápisu hranatých závorek ([]):

Příklad

const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);
  x = myObj["name"];

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>Access a JavaScript Object</h2>
<p id="demo"></p>

<script>
const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);
document.getElementById("demo").innerHTML = myObj["name"];
</script>

</body>
</html>

Opakování objektu

Vlastnosti objektu můžete procházet smyčkou for-in:

Příklad

const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);

let text = "";
for (const x in myObj) {
  text += x + ", ";
}

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>Looping Object Properties</h2>
<p id="demo"></p>

<script>
const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);

let text = "";
for (const x in myObj) {
  text += x + ", ";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Ve smyčce for-in použijte pro přístup k hodnotám vlastnosti:

Příklad

const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);

let text = "";
for (const x in myObj) {
  text += myObj[x] + ", ";
}

Zkuste to sami →

<!DOCTYPE html>
<html>
<body>

<h2>Looping JavaScript Object Values</h2>
<p id="demo"></p>

<script>
const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);

let text = "";
for (const x in myObj) {
  text += myObj[x] + ", ";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>