Object.keys, Werte, Einträge

Lassen Sie uns von den einzelnen Datenstrukturen Abstand nehmen und über die Iterationen darüber sprechen.

Im vorherigen Kapitel haben wir die Methoden map.keys() , map.values() , map.entries() gesehen.

Diese Methoden sind generisch, es besteht eine allgemeine Vereinbarung, sie für Datenstrukturen zu verwenden. Wenn wir jemals eine eigene Datenstruktur erstellen, sollten wir diese auch implementieren.

Sie werden unterstützt für:

• Map

• Set

• Array

Einfache Objekte unterstützen ebenfalls ähnliche Methoden, die Syntax ist jedoch etwas anders.

Object.keys, Werte, Einträge

Für einfache Objekte stehen folgende Methoden zur Verfügung:

• Object.keys(obj) – gibt ein Array von Schlüsseln zurück.

• Object.values(obj) – gibt ein Array von Werten zurück.

• Object.entries(obj) – gibt ein Array von [key, value] -Paaren zurück.

Bitte beachten Sie die Unterschiede (z. B. zur Karte):

Der erste Unterschied besteht darin, dass wir Object.keys(obj) und nicht obj.keys() aufrufen müssen.

Warum so? Der Hauptgrund ist Flexibilität. Denken Sie daran, dass Objekte die Grundlage aller komplexen Strukturen in JavaScript sind. Wir haben also möglicherweise ein eigenes Objekt wie data , das seine eigene data.values() -Methode implementiert. Und wir können weiterhin Object.values(data) darauf aufrufen.

Der zweite Unterschied besteht darin, dass Object.* -Methoden „echte“ Array-Objekte zurückgeben, nicht nur ein iterierbares. Das hat vor allem historische Gründe.

Zum Beispiel:

 let user = {
  Name: „John“,
  Alter: 30
};

• Object.keys(user) = ["name", "age"]

• Object.values(user) = ["John", 30]

• Object.entries(user) = [ ["name","John"], ["age",30] ]

Hier ist ein Beispiel für die Verwendung von Object.values ​​zum Durchlaufen von Eigenschaftswerten:

 let user = {
  Name: „John“,
  Alter: 30
};

// Schleife über Werte
for (let value of Object.values(user)) {
  Warnung(Wert); // John, damals 30
}

Object.keys/values/entries ignorieren symbolische Eigenschaften

Genau wie eine for..in Schleife ignorieren diese Methoden Eigenschaften, die Symbol(...) als Schlüssel verwenden.

Normalerweise ist das praktisch. Wenn wir aber auch symbolische Schlüssel wollen, gibt es eine separate Methode Object.getOwnPropertySymbols, die ein Array nur mit symbolischen Schlüsseln zurückgibt. Außerdem gibt es eine Methode Reflect.ownKeys(obj), die alle Schlüssel zurückgibt.

Objekte transformieren

Objekten fehlen viele Methoden, die es für Arrays gibt, z. B. map , filter und andere.

Wenn wir sie anwenden möchten, können wir Object.entries gefolgt von Object.fromEntries verwenden:

1. Verwenden Sie Object.entries(obj) um ein Array von Schlüssel/Wert-Paaren von obj abzurufen.

2. Verwenden Sie Array-Methoden für dieses Array, z. B. map , um diese Schlüssel/Wert-Paare zu transformieren.

3. Verwenden Sie Object.fromEntries(array) für das resultierende Array, um es wieder in ein Objekt umzuwandeln.

Wir haben zum Beispiel ein Objekt mit Preisen und möchten diese verdoppeln:

 let Preise = {
  Banane: 1,
  orange: 2,
  Fleisch: 4,
};

let doublePrices = Object.fromEntries(
  // Preise in Array umwandeln, jedes Schlüssel/Wert-Paar einem anderen Paar zuordnen
  // und dann gibt fromEntries das Objekt zurück
  Object.entries(Preise).map(Eintrag => [Eintrag[0], Eintrag[1] * 2])
);

alarm(doublePrices.meat); // 8

Es mag auf den ersten Blick schwierig aussehen, wird aber nach ein- oder zweimaliger Verwendung leicht verständlich. Auf diese Weise können wir leistungsstarke Transformationsketten erstellen.

Aufgaben

Summieren Sie die Eigenschaften

Wichtigkeit: 5

Es gibt ein salaries mit einer beliebigen Anzahl von Gehältern.

Schreiben Sie die Funktion sumSalaries(salaries) die mithilfe von Object.values ​​und der for..of Schleife die Summe aller Gehälter zurückgibt.

Wenn salaries leer sind, muss das Ergebnis 0 sein.

Zum Beispiel:

 lass Gehälter = {
  „John“: 100,
  „Pete“: 300,
  „Maria“: 250
};

alarm( sumSalaries(gehälter) ); // 650

Öffnen Sie eine Sandbox mit Tests.

Lösung

 Funktion sumSalaries(salaries) {

  sei Summe = 0;
  for (let Salary of Object.values(salaries)) {
    Summe += Gehalt;
  }

  Rückgabesumme; // 650
}

lass Gehälter = {
  „John“: 100,
  „Pete“: 300,
  „Maria“: 250
};

alarm( sumSalaries(gehälter) ); // 650

Alternativ können wir optional auch die Summe mithilfe von Object.values ​​ermitteln und reduce :

 // Schleifen über Array von Gehältern reduzieren,
// Addiere sie
// und gibt das Ergebnis zurück
Funktion sumSalaries(salaries) {
  return Object.values(salaries).reduce((a, b) => a + b, 0) // 650
}

Öffnen Sie die Lösung mit Tests in einer Sandbox.

Zählen Sie Eigenschaften

Wichtigkeit: 5

Schreiben Sie eine Funktion count(obj) die die Anzahl der Eigenschaften im Objekt zurückgibt:

 let user = {
  Name: 'John',
  Alter: 30
};

alarm( count(user) ); // 2

Versuchen Sie, den Code so kurz wie möglich zu gestalten.

PS: Ignorieren Sie symbolische Eigenschaften, zählen Sie nur „normale“.

Öffnen Sie eine Sandbox mit Tests.

Lösung

 Funktion count(obj) {
  return Object.keys(obj).length;
}

Öffnen Sie die Lösung mit Tests in einer Sandbox.