So iterieren Sie mit JavaScript über Objektschlüssel

Benutzerdefinierte Objekte können nicht verwendet werden for...of 循环进行迭代。此外，您不能使用 map() 和 forEach() 等迭代器方法。如果这样做，您将在每个实例中收到 TypeError .

Verwenden Sie stattdessen for...in, um über Objekte zu iterieren. Diese Methode iteriert über alle aufzählbaren, nicht symbolischen Eigenschaften des Objekts.

Im folgenden Beispiel iterieren wir damit über alle drei Eigenschaften von obj und protokollieren für jede Eigenschaft eine Zeichenfolge, die aus dem Eigenschaftsnamen (d. h. ihrem Schlüssel) und dem entsprechenden Wert besteht.

var obj = {a: 1, b: 2, c: 3};

for (const prop in obj) {
  console.log(`obj.${prop} = ${obj[prop]}`);
}

// Output:
// "obj.a = 1"
// "obj.b = 2"
// "obj.c = 3"

Wir initialisieren die Schleife mit einer Variablen prop, die bei jeder Iteration der Objekteigenschaften einen anderen Eigenschaftsnamen (auch Schlüssel genannt) enthält. Der im Block angegebene Code wird bei jeder Iteration ausgeführt.

Hier ist eine kleine Demo, um dies zu demonstrieren (klicken Sie auf Ergebnisse, um die Ausgabe anzuzeigen):

Innerhalb der Schleife protokollieren wir bei jeder Iteration einen der Eigenschaftsnamen und -werte des Objekts in der Konsole.

Eine andere Möglichkeit, die Eigenschaften eines Objekts zu durchlaufen, besteht darin, das Objekt an Object.entries() zu übergeben und die Methode aufzurufen. Dadurch werden alle aufzählbaren Eigenschaften dieses Objekts innerhalb eines mehrdimensionalen Arrays (Array von Arrays) zurückgegeben:

const obj = {a: 1, b: 2, c: 3};

let result = Object.entries(obj)

console.log(result)
// [["a", 1], ["b", 2], ["c", 3]]

Dann können wir es mit einer beliebigen Array-Iterator-Methode durchlaufen:

Object.entries(obj).forEach(entry => {
  // do something
})

Object.entries(obj).map(entry => {
  // do something
})

Object.entries(obj).every(entry => {
  // do something
})

Sie können auch for...of Schleife verwenden:

for (const entry of Object.entries(obj)) {
  // do something
}

for (const [key, value] of Object.entries(obj)) {
  // do something
}

Hier sind einige Demos:

Da wir hier in jeder Iteration ein Array von Schlüsseln und Werten erhalten, verwenden wir einfach entry[0] bzw. entry[1], um sie aufzurufen. Wenn Sie nur Schlüssel anstelle von Schlüsseln und Werten benötigen, verwenden Sie Object.keys() anstelle von entry[0] 和 entry[1] 来访问它们。如果您只需要键而不是键和值，请使用 Object.keys() 代替 Object.entries().

for...of Im Grunde das Gleiche:

Fazit

Dies sind die Methoden, mit denen wir die Eigenschaften und Schlüssel eines Objekts in JavaScript einfach durchlaufen können. Weitere Artikel und Tutorials finden Sie in unserem JavaScript-Beitrag.

Das obige ist der detaillierte Inhalt vonSo iterieren Sie mit JavaScript über Objektschlüssel. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!