JavaScript - For...in-Schleife: Ein Leitfaden für Anfänger

Hallo da draußen, angehender Programmierer! Heute tauchen wir in eines der nützlichen Werkzeuge von JavaScript ein: die for...in-Schleife. Machen Sie sich keine Sorgen, wenn Sie noch nie codiert haben – ich werde Sie Schritt für Schritt durchführen, genau wie ich es in den letzten Jahren mit unzähligen Schülern gemacht habe. Also, holen Sie sich eine Tasse Kaffee (oder Tee, wenn das mehr Ihr Ding ist) und los geht's!

JavaScript - For...in

Was ist die for...in-Schleife?

Bevor wir uns den Details widmen, lassen Sie uns verstehen, was die for...in-Schleife eigentlich ist. Stellen Sie sich vor, Sie haben eine große Kiste voller Spielzeuge (in JavaScript nennen wir diese Kiste ein "Objekt"). Die for...in-Schleife ist wie eine magische Hand, die in die Kiste greift und ein nach dem anderen Spielzeug herauszieht, sodass Sie jedes Spielzeug einzeln ansehen können.

In der Programmierung ermöglicht die for...in-Schleife es uns, über die Eigenschaften eines Objekts zu iterieren. Es ist eine Möglichkeit, jede Speicherstelle in einem Objekt einzeln zu untersuchen.

Syntax der for...in-Schleife

Nun schauen wir uns an, wie man eine for...in-Schleife schreibt. Machen Sie sich keine Sorgen, wenn es am Anfang etwas seltsam aussieht – wir werden es gemeinsam auseinandernehmen!

for (let key in object) {
// auszuführender Code
}

Lassen Sie uns das analysieren:

  • for: Dieses Schlüsselwort lässt JavaScript wissen, dass wir eine Schleife beginnen.
  • let key: Dies erstellt eine Variable (hier nennen wir sie key), die den Namen jeder Eigenschaft halten wird, während wir durch das Objekt gehen.
  • in: Dieses Schlüsselwort trennt den Variablennamen vom Objekt, das wir durchlaufen.
  • object: Dies ist das Objekt, das wir untersuchen möchten.
  • Die geschweiften Klammern {} enthalten den Code, der für jede Eigenschaft im Objekt ausgeführt wird.

Beispiele der for...in-Schleife in der Praxis

Beispiel 1: Ein einfaches Objekt erkunden

Lassen Sie uns mit einem einfachen Beispiel beginnen. Stellen wir uns ein Objekt vor, das ein Buch darstellt:

let buch = {
titel: "Der groβe Gatsby",
autor: "F. Scott Fitzgerald",
jahr: 1925
};

for (let eigenschaft in buch) {
console.log(eigenschaft + ": " + buch[eigenschaft]);
}

Wenn wir diesen Code ausführen, ist hier, was wir in der Konsole sehen werden:

titel: Der groβe Gatsby
autor: F. Scott Fitzgerald
jahr: 1925

Was passiert hier? Unsere for...in-Schleife geht durch jede Eigenschaft des buch-Objekts. Bei jeder Iteration:

  • eigenschaft hält den Namen der aktuellen Eigenschaft ("titel", "autor" oder "jahr").
  • buch[eigenschaft] gibt uns den Wert dieser Eigenschaft.
  • Wir verwenden console.log(), um sowohl den Eigenschaftsnamen als auch seinen Wert auszugeben.

Beispiel 2: Eigenschaften zählen

Angenommen, wir möchten zählen, wie viele Eigenschaften ein Objekt hat:

let auto = {
marke: "Toyota",
modell: "Corolla",
jahr: 2020,
farbe: "blau"
};

let eigenschaftAnzahl = 0;

for (let eig in auto) {
eigenschaftAnzahl++;
}

console.log("Das Auto-Objekt hat " + eigenschaftAnzahl + " Eigenschaften.");

Dies wird ausgeben: "Das Auto-Objekt hat 4 Eigenschaften."

In diesem Beispiel verwenden wir die for...in-Schleife, um durch jede Eigenschaft des auto-Objekts zu gehen. Anstatt etwas mit den Eigenschaften selbst zu tun, erhöhen wir einfach einen Zähler bei jeder Schleifenlaufzeit. Dies gibt uns die Gesamtzahl der Eigenschaften im Objekt.

Beispiel 3: Eigenschaften filtern

Manchmal möchte man nur mit bestimmten Eigenschaften etwas tun. Sehen wir uns ein Beispiel an:

let person = {
name: "Alice",
alter: 30,
stadt: "New York",
beruf: "Ingenieur",
hobby: "malen"
};

console.log("Eigenschaften, die mit 'j' beginnen:");
for (let eig in person) {
if (eig.startsWith('j')) {
console.log(eig + ": " + person[eig]);
}
}

Dies wird ausgeben:

Eigenschaften, die mit 'j' beginnen:
beruf: Ingenieur

In diesem Beispiel verwenden wir die for...in-Schleife, um durch alle Eigenschaften des person-Objekts zu gehen, aber wir protokollieren nur die Eigenschaften, die mit dem Buchstaben 'j' beginnen. Wir verwenden die startsWith()-Methode, um diese Bedingung zu überprüfen.

Häufig verwendete Methoden in Verbindung mit for...in-Schleifen

Hier ist eine Tabelle einiger häufig verwendeter Methoden, die Sie in Verbindung mit for...in-Schleifen einsetzen können:

Methode Beschreibung Beispiel
hasOwnProperty() Überprüft, ob die Eigenschaft direkt im Objekt ist (nicht vererbt) if (objekt.hasOwnProperty(eigenschaft))
Object.keys() Gibt ein Array der eigenen enumerable Eigenschaftsnamen eines Objekts zurück Object.keys(objekt)
Object.values() Gibt ein Array der eigenen enumerable Eigenschaftswerte eines Objekts zurück Object.values(objekt)
Object.entries() Gibt ein Array der eigenen enumerable Zeichenketten-schüssigen Eigenschaft [Schlüssel, Wert]-Paare eines Objekts zurück Object.entries(objekt)

Fazit

Und da haben Sie es! Sie haben gerade Ihre ersten Schritte in die Welt der for...in-Schleifen gewagt. Erinnern Sie sich daran, dass Programmieren wie das Fahrradfahren lernen ist – es erfordert Übung. Lassen Sie sich nicht entmutigen, wenn es nicht sofort klappt – experimentieren Sie weiter mit verschiedenen Objekten und sehen Sie, was Sie mit for...in-Schleifen alles machen können.

Wie wir in der Programmierwelt sagen: "Der einzige Weg, Programmieren zu lernen, ist zu programmieren!" Also, warum nicht versuchen, Ihre eigenen Objekte zu erstellen und sie mit for...in-Schleifen zu erkunden? Vielleicht erstellen Sie ein Objekt, das Ihren Lieblingsfilm oder Ihr Lieblingsbuch darstellt, und sehen, was Sie damit alles anstellen können.

viel Spaß beim Programmieren, und denken Sie daran – jeder Experte war einmal ein Anfänger. Bleiben Sie dran, und bevor Sie es wissen, werden Sie Objekte wie ein Profi durchlaufen!

Credits: Image by storyset