> ## Documentation Index
> Fetch the complete documentation index at: https://docs.baenninger.me/llms.txt
> Use this file to discover all available pages before exploring further.

# Erstellen und Manipulieren

## Objekte erstellen

```javascript theme={null}
const levin = {
  firstName: 'Levin',
  lastName: 'Bänninger',
  age: 17,
  job: 'Software Engineer',
  friends: ['Jonas', 'Marie', 'Peter'],
  work(hours) {
    console.log(`{this.firstName} is working for {hours} hours...`);
  }
};
```

<Info>
  Wir können in einem Objekt alle Datentypen benutzen
</Info>

## Datenzugriff

Es gibt zwei Möglichkeiten, auf Daten eines Objekts zuzugreifen:

* **Punktnotation**
* **Klammernotation**

### Punktnotation

Die Syntax der Punktnotation sieht wie folgt aus:

```javascript theme={null}
objName.property;
```

Es ist ziemlich einfach. Beispiel mit unseren Personendaten:

```javascript theme={null}
const levin = {
  firstName: 'Levin',
  lastName: 'Bänninger',
  age: 17,
  job: 'Student',
  friends: ['Jonas', 'Marie', 'Peter'],
};

levin.lastName;
levin.age;
levin.friends;
```

### Klammernotation

Die Syntax für die Klammerschreibweise sieht wie folgt aus:

```javascript theme={null}
objName['expression'];
```

Wie du sehen kannst, ist das auch ziemlich einfach. Wieder das Beispiel mit unseren Personendaten:

```javascript theme={null}
levin['lastName'];
levin['age'];
levin['friends'];
```

<Warning>
  Wenn wir versuchen, auf eine Eigenschaft zuzugreifen, die nicht existiert, erhalten wir `undefined`.
</Warning>

### Unterschied

Der grosse Unterschied, zwischen den beiden ist, dass ich mit der Klammerschreibweise einen Ausdruck eintippen kann. Du könntest zum Beispiel Folgendes tun:

```javascript theme={null}
const nameKey = 'Name';
levin['first' + nameKey];
levin['last' + nameKey];
```

Das ist nicht möglich mit der Punktnotation.

<Check>
  **Wann sollte ich was verwenden?**

  In der Regel solltest du immer die Punktschreibweise verwenden, weil sie viel einfacher zu lesen ist. Verwende die Klammerschreibweise nur, wenn du den Eigenschaftsnamen berechnen musst.
</Check>

## Objekte manipulieren

### Property hinzufügen

```javascript theme={null}
levin.location = 'Switzerland';
levin['twitter'] = '@LevinBaenninger';
```

### Property bearbeiten

```javascript theme={null}
levin.job = 'programmer';
levin['location'] = 'Zurich';
```

### Property löschen

```javascript theme={null}
delete levin.location;
delete levin['twitter'];
```