JSON Literals

Tartalomjegyzék

    Tartalomjegyzék megjelenítése

Ez egy JSON karakterlánc:

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

A JSON karakterláncon belül van egy JSON objektum literál:

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

A JSON-objektum literálokat kapcsos zárójelek veszik körül {}.

A JSON objektum literálok kulcs/érték párokat tartalmaznak.

A kulcsokat és az értékeket kettőspont választja el.

A kulcsoknak karakterláncoknak kell lenniük, és az értékeknek érvényes JSON-adattípusnak kell lenniük:

  • karakterlánc
  • szám
  • objektum
  • tömb
  • logikai érték
  • null

Minden kulcs/érték pár vesszővel van elválasztva.

Gyakori hiba, hogy egy JSON-objektumot szó szerint „JSON-objektumnak” neveznek.

A JSON nem lehet objektum. A JSON egy karakterlánc-formátum.

Az adatok csak akkor JSON, ha karakterlánc formátumban vannak. Amikor JavaScript-változóvá alakítják, JavaScript objektummá válik.

JavaScript objektumok

Létrehozhat JavaScript objektumot JSON objektum literálból:

Példa

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

Próbálja ki Ön is →

<!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>

Általában egy JavaScript-objektumot egy JSON-karakterlánc elemzésével hoz létre:

Példa

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

Próbálja ki Ön is →

<!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>

Az objektumértékek elérése

Az objektumértékeket pont (.) jelöléssel érheti el:

Példa

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

Próbálja ki Ön is →

<!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>

Az objektumértékeket zárójeles ([]) jelöléssel is elérheti:

Példa

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

Próbálja ki Ön is →

<!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>

Tárgy hurkolása

Az objektumtulajdonságok között egy for-in ciklussal lépkedhet:

Példa

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

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

Próbálja ki Ön is →

<!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>

Egy for-in ciklusban használja a zárójelet a tulajdonságok értékeinek eléréséhez:

Példa

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

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

Próbálja ki Ön is →

<!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>