Erklärung
Neben primitiven Datentypen wie number und string gibt es in JavaScript noch einen weiteren wichtigen Datentyp: object.
Objekte sind Sammlungen von Schlüssel-Wert-Paaren.
Du kannst sie daher genauso verwenden wie das, was in anderen Sprachen oft Map oder Wörterbuch genannt wird.
In anderen Sprachen müssen alle Werte in einer Map oft denselben Datentyp haben.
In JavaScript ist nur der Typ des Schlüssels eingeschränkt: Er muss ein string sein.
Die Werte innerhalb eines Objekts können unterschiedliche Typen haben.
Sie können primitive Typen wie Zahlen sein, aber auch Arrays, andere Objekte oder sogar Funktionen.
Das macht Objekte sehr vielseitig, sodass sie auch zentrale Elemente der objektorientierten Programmierung (OOP) in JavaScript sind.
Im Folgenden konzentrieren wir uns auf Objekte als Sammlungen oder Maps.
Andere Anwendungsfälle von Objekten behandeln wir in anderen Konzepten, siehe zum Beispiel Klassen.
Ein Objekt erstellen
Ein Objekt erstellst du mit geschweiften Klammern.
Du kannst auch direkt einige Einträge angeben.
Dazu gibst du zuerst den Schlüssel an, gefolgt von einem Doppelpunkt und dem Wert.
const emptyObject = {};
const obj = {
favoriteNumber: 42,
greeting: 'Hello World',
useGreeting: true,
address: {
street: 'Trincomalee Highway',
city: 'Batticaloa',
},
fruits: ['melon', 'papaya'],
addNumbers: function (a, b) {
return a + b;
},
};
Das Komma nach dem letzten Eintrag ist in JavaScript optional.
Vielleicht fragst du dich, warum die Schlüssel nicht in Anführungszeichen stehen, obwohl sie Strings sein sollen.
Das ist eine Kurzschreibweise.
Wenn der Schlüssel den Namensregeln für einen JavaScript-Bezeichner folgt, kannst du die Anführungszeichen weglassen.
Bei Schlüsseln mit Sonderzeichen im Namen musst du die übliche String-Notation verwenden.
const obj = {
'1keyStartsWithNumber': '...',
'key/with/slashes': '...',
'key-with-dashes': '...',
'key with spaces': '...',
'#&()[]{}èä樹keyWithSpecialChars': '...',
};
Einen Wert abrufen
Es gibt zwei Möglichkeiten, den Wert für einen bestimmten Schlüssel abzurufen: die Punktnotation und die Klammernotation.
const obj = { greeting: 'hello world' };
obj.greeting;
// => hello world
obj['greeting'];
// => hello world
// Bracket notation also works with variables.
const key = 'greeting';
obj[key];
// => hello world
Die Punktnotation als Kurzschreibweise hat dieselbe Einschränkung wie das Weglassen der Anführungszeichen.
Sie funktioniert nur, wenn der Schlüssel den Namensregeln für Bezeichner folgt.
Einen Wert hinzufügen oder ändern
Du kannst einen Wert mit dem Zuweisungsoperator = hinzufügen oder ändern.
Auch hier stehen dir die Punkt- und die Klammernotation zur Verfügung.
const obj = { greeting: 'hello world' };
obj.greeting = 'Hi there!';
obj['greeting'] = 'Welcome.';
obj.newKey1 = 'new value 1';
obj['new key 2'] = 'new value 2';
const key = 'new key 3';
obj[key] = 'new value 3';
Einen Eintrag löschen
Du kannst ein Schlüssel-Wert-Paar mit dem delete-Schlüsselwort aus einem Objekt löschen.
const obj = {
key1: 'value1',
key2: 'value2',
};
delete obj.key1;
delete obj['key2'];
Prüfen, ob ein Schlüssel existiert
Mit der Methode hasOwnProperty kannst du prüfen, ob ein bestimmter Schlüssel in einem Objekt existiert.
const obj = { greeting: 'hello world' };
obj.hasOwnProperty('greeting');
// => true
obj.hasOwnProperty('age');
// => false
Ein Objekt durchlaufen
Es gibt eine spezielle for...in-Schleife, um über alle Schlüssel eines Objekts zu iterieren.
const obj = {
name: 'Ali',
age: 65,
};
for (let key in obj) {
console.log(key, obj[key]);
}
// name Ali
// age 65
Um subtile Fehler zu vermeiden, solltest du immer davon ausgehen, dass die for...in-Schleife die Schlüssel in einer beliebigen Reihenfolge besucht.
Beachte außerdem, dass for...in geerbte Schlüssel in die Iteration einbezieht.
Lernübung
