JavaScript-Anzeigeobjekte
Wie werden JavaScript-Objekte angezeigt?
Beim Anzeigen eines JavaScript-Objekts wird [object Object] ausgegeben .
Beispiel
const person = {
name: "John",
age: 30,
city: "New York"
};
document.getElementById("demo").innerHTML = person;
Einige gängige Lösungen zum Anzeigen von JavaScript-Objekten sind:
- Anzeigen der Objekteigenschaften nach Namen
- Anzeigen der Objekteigenschaften in einer Schleife
- Anzeigen des Objekts mit Object.values()
- Anzeigen des Objekts mit JSON.stringify()
Objekteigenschaften anzeigen
Die Eigenschaften eines Objekts können als String angezeigt werden:
Beispiel
const person = {
name: "John",
age: 30,
city: "New York"
};
document.getElementById("demo").innerHTML =
person.name + "," + person.age + "," + person.city;
Anzeigen des Objekts in einer Schleife
Die Eigenschaften eines Objekts können in einer Schleife gesammelt werden:
Beispiel
const person = {
name: "John",
age: 30,
city: "New York"
};
let txt = "";
for (let x in person) {
txt += person[x] + " ";
};
document.getElementById("demo").innerHTML = txt;
Sie müssen person[x] in der Schleife verwenden.
person.x wird nicht funktionieren (weil x eine Variable ist).
Object.values() verwenden
Jedes JavaScript-Objekt kann mit in ein Array konvertiert werden Object.values():
const person = {
name: "John",
age: 30,
city: "New York"
};
const myArray = Object.values(person);
myArray ist jetzt ein JavaScript-Array, bereit zur Anzeige:
Beispiel
const person = {
name: "John",
age: 30,
city: "New York"
};
const myArray = Object.values(person);
document.getElementById("demo").innerHTML = myArray;
Object.values() wird seit 2016 in allen gängigen Browsern unterstützt.
| 54 (2016) | 14 (2016) | 47 (2016) | 10 (2016) | 41 (2016) |
Verwendung von JSON.stringify()
Jedes JavaScript-Objekt kann mit der JavaScript-Funktion stringifiziert (in einen String konvertiert) werden
JSON.stringify():
const person = {
name: "John",
age: 30,
city: "New York"
};
let myString = JSON.stringify(person);
myString ist jetzt ein JavaScript-String, der angezeigt werden kann:
Beispiel
const person = {
name: "John",
age: 30,
city: "New York"
};
let myString = JSON.stringify(person);
document.getElementById("demo").innerHTML = myString;
Das Ergebnis ist eine Zeichenfolge nach der JSON-Notation:
{"name":"John","age":50,"city":"New York"}
JSON.stringify() ist in JavaScript enthalten und wird von allen gängigen Browsern unterstützt.
Daten stringifizieren
JSON.stringify wandelt Datumsangaben in Strings um:
Beispiel
const person = {
name: "John",
today: new Date()
};
let myString = JSON.stringify(person);
document.getElementById("demo").innerHTML = myString;
Stringify-Funktionen
JSON.stringify wird keine Funktionen stringifizieren:
Beispiel
const person = {
name: "John",
age: function () {return 30;}
};
let myString = JSON.stringify(person);
document.getElementById("demo").innerHTML = myString;
Dies kann "behoben" werden, wenn Sie die Funktionen vor dem Stringifizieren in Zeichenfolgen konvertieren.
Beispiel
const person = {
name: "John",
age: function () {return 30;}
};
person.age = person.age.toString();
let myString = JSON.stringify(person);
document.getElementById("demo").innerHTML = myString;
Arrays stringifizieren
Es ist auch möglich, JavaScript-Arrays zu stringifizieren:
Beispiel
const arr = ["John", "Peter", "Sally", "Jane"];
let myString = JSON.stringify(arr);
document.getElementById("demo").innerHTML = myString;
Das Ergebnis ist eine Zeichenfolge nach der JSON-Notation:
["John","Peter","Sally","Jane"]