Ein Objekt in ein Array abbilden

JavaScriptJavaScriptBeginner
Jetzt üben

This tutorial is from open-source community. Access the source code

💡 Dieser Artikel wurde von AI-Assistenten übersetzt. Um die englische Version anzuzeigen, können Sie hier klicken

Einführung

In diesem Lab werden wir lernen, wie man ein Objekt mithilfe der listify()-Funktion in JavaScript in ein Objektarray abbildet. Die Funktion verwendet Object.entries() und Array.prototype.reduce(), um das Objekt abzubilden, und mapFn, um die Schlüssel und Werte des Objekts abzubilden. Am Ende dieses Labs werden Sie in der Lage sein, Objekte effizient in Arrays zu mappen, indem Sie JavaScript verwenden.


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("JavaScript")) -.-> javascript/BasicConceptsGroup(["Basic Concepts"]) javascript(("JavaScript")) -.-> javascript/AdvancedConceptsGroup(["Advanced Concepts"]) javascript/BasicConceptsGroup -.-> javascript/variables("Variables") javascript/BasicConceptsGroup -.-> javascript/data_types("Data Types") javascript/BasicConceptsGroup -.-> javascript/arith_ops("Arithmetic Operators") javascript/BasicConceptsGroup -.-> javascript/comp_ops("Comparison Operators") javascript/AdvancedConceptsGroup -.-> javascript/higher_funcs("Higher-Order Functions") javascript/AdvancedConceptsGroup -.-> javascript/destr_assign("Destructuring Assignment") javascript/AdvancedConceptsGroup -.-> javascript/spread_rest("Spread and Rest Operators") subgraph Lab Skills javascript/variables -.-> lab-28472{{"Ein Objekt in ein Array abbilden"}} javascript/data_types -.-> lab-28472{{"Ein Objekt in ein Array abbilden"}} javascript/arith_ops -.-> lab-28472{{"Ein Objekt in ein Array abbilden"}} javascript/comp_ops -.-> lab-28472{{"Ein Objekt in ein Array abbilden"}} javascript/higher_funcs -.-> lab-28472{{"Ein Objekt in ein Array abbilden"}} javascript/destr_assign -.-> lab-28472{{"Ein Objekt in ein Array abbilden"}} javascript/spread_rest -.-> lab-28472{{"Ein Objekt in ein Array abbilden"}} end

Wie man in JavaScript ein Objekt in ein Array abbildet

Um in JavaScript ein Objekt in ein Array abzubilden, kannst du die listify()-Funktion verwenden. Hier ist, wie du es tun kannst:

  1. Öffne das Terminal/SSH und tippe node, um zu beginnen, zu programmieren.

  2. Verwende Object.entries(), um ein Array der Schlüssel-Wert-Paare des Objekts zu erhalten.

  3. Verwende Array.prototype.reduce(), um das Array in ein Objekt abzubilden.

  4. Verwende mapFn, um die Schlüssel und Werte des Objekts abzubilden, und Array.prototype.push(), um die abgebildeten Werte zum Array hinzuzufügen.

Hier ist der Code für die listify()-Funktion:

const listify = (obj, mapFn) =>
  Object.entries(obj).reduce((acc, [key, value]) => {
    acc.push(mapFn(key, value));
    return acc;
  }, []);

Und hier ist ein Beispiel, wie du es mit einem Objekt namens people verwendest:

const people = { John: { age: 42 }, Adam: { age: 39 } };
listify(people, (key, value) => ({ name: key, ...value }));
// [ { name: 'John', age: 42 }, { name: 'Adam', age: 39 } ]

Mit dieser Funktion kannst du in JavaScript leicht ein Objekt in ein Array abbilden.

Zusammenfassung

Herzlichen Glückwunsch! Du hast das Lab "Map an Object to an Array" abgeschlossen. Du kannst in LabEx weitere Labs absolvieren, um deine Fähigkeiten zu verbessern.