Kombinieren Sie die Werte zweier Arrays zu einem Objekt

Lesezeit: 4 Minuten

Ich habe zwei Arrays:

array1 = ["Bob", "John", "Dave"];
array2 = [1, 2, 3];

Kombinieren Sie die beiden zu einem Javascript-Array, das mit Objekten gefüllt ist und wie folgt aussieht:

[
  {meta: 'Bob', value: 1 },
  {meta: 'John', value: 2},
  {meta: 'Dave', value: 3}
]

  • Das gibt es auf jeden Fall, und ich helfe Ihnen gerne dabei, zu verstehen, wie. Haben Sie selbst etwas ausprobiert?

    – Mike Gluck

    24. Februar 2017 um 21:56 Uhr


  • Während ich mit der Handhabung und dem Jonglieren von Array-Daten sehr vertraut bin, bin ich das genaue Gegenteil, wenn es um Objekte geht, mehr noch, wenn ich die beiden kombiniere. Am nächsten kam ich daran, dass ein Array der Schlüssel und das zweite der Wert war.

    – iiii

    24. Februar 2017 um 21:59 Uhr


Lass es uns aufschlüsseln.

Sie haben zwei Arrays gleicher Länge und möchten aus jedem einen Wert extrahieren.

// Could also do array2.length since they're the same size
for (var i = 0; i < array1.length; i++) {
  var val1 = array1[i];
  var val2 = array2[i]
}

und Sie möchten ein Objekt mit diesen beiden Werten erstellen

for (var i = 0; i < array1.length; i++) {
  var val1 = array1[i];
  var val2 = array2[i]
  var obj = {
    meta: val1,
    value: val2
  };
}

Schließlich möchten Sie jedes dieser generierten Objekte in einem Array speichern

var result = [];
for (var i = 0; i < array1.length; i++) {
  var val1 = array1[i];
  var val2 = array2[i]
  var obj = {
    meta: val1,
    value: val2
  };
  result.push(obj);
}

Und jetzt haben Sie Ihr Ergebnis!

Sie können dies auf verschiedene Arten umschreiben. Zum Beispiel:

var result = array1.map(function(val1, index) {
  return {
    meta: val1,
    value: array2[index]
  };
});

oder wenn Sie sich in einer Umgebung befinden, die dies unterstützt:

let result = array1.map((val1, index) => (
  {
    meta: val1,
    value: array2[index]
  }
));

  • Tolle Antwort, gut erklärt

    – Das Ö

    24. Februar 2017 um 22:15 Uhr

  • Danke, dass du es Schritt für Schritt erklärt hast!

    – iiii

    24. Februar 2017 um 22:45 Uhr

Benutzer-Avatar
netter Benutzer

Es ist einer der Wege, wie man es erreichen kann. Sie können verwenden Array#forEach Funktion, um über jedes Element von zu iterieren array1. Erstellen Sie dann ein leeres Objekt und legen Sie die angegebenen Eigenschaften fest – in Ihrem Fall: meta und value. Dann – weisen Sie ihm Elemente zu und schieben Sie es einfach in die arr Variable.

var array1 = ["Bob", "John", "Dave"],
    array2 = [1, 2, 3],
    arr = [];

array1.forEach(function(v,i){
  var obj = {};
  obj.meta = v;
  obj.value = array2[i];
  arr.push(obj);
});

console.log(arr);

  • Das war’s! Ich danke dir sehr! Speichern Sie diesen Ausschnitt auf jeden Fall.

    – iiii

    24. Februar 2017 um 22:03 Uhr

  • Warum sollten Sie zuerst ein leeres Objekt erstellen, anstatt ein Objektliteral zu verwenden, um alle Eigenschaften in einer Anweisung zu erstellen?

    – nnnnn

    24. Februar 2017 um 22:43 Uhr

  • @eeetee Danke, schönen Tag noch (:

    – freundlicher Benutzer

    24. Februar 2017 um 22:44 Uhr

  • @nnnnnn Lass mich nachdenken, ich habe diese Methode viele Male auf dem Stapel gesehen, sogar mein JS-Guru – Nina Scholz hat Objekte auf diese Weise gesetzt. Wie auch immer – es ist nur eine der Möglichkeiten, wie man es lösen kann.

    – freundlicher Benutzer

    24. Februar 2017 um 22:45 Uhr

Einfache Lösung mit Array.prototype.map() Funktion:

var array1 = ["Bob", "John", "Dave"], 
    array2 = [1, 2, 3],
    combined = array1.map(function(v, k, a){ return {meta: v, value: array2[k]}; });
    
console.log(combined);

Sie könnten ein Objekt verwenden und die Schlüssel und Werte iterieren.

var array1 = ["Bob", "John", "Dave"],
    array2 = [1, 2, 3],
    object = { meta: array1, value: array2 },
    result = Object.keys(object).reduce(function (r, k) {
        object[k].forEach(function (a, i) {
            r[i] = r[i] || {};
            r[i][k] = a;
        });
        return r;
    }, []);

console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Angenommen, Sie verwenden Chrome, könnten Sie Folgendes tun:

const combined = array1.map((name,i) => ({meta: name, value: array2[i]}))

  • Warum Chrome wichtig?

    – Studiozeit

    24. Februar 2017 um 22:01 Uhr

  • Sowohl Chrome als auch Firefox unterstützen diese Syntax. Nicht sicher über ältere Versionen von IE. Speziell const und die fette Pfeilsyntax könnte Probleme bereiten.

    – Nathan

    24. Februar 2017 um 22:02 Uhr

  • Während Ihre Lösung gut ist, wollte ich auch die Ecmascript5-Version sehen

    – RomanPerechrest

    24. Februar 2017 um 22:03 Uhr

  • IE11 unterstützt const aber keine Pfeilfunktionen. MS Edge unterstützt beides.

    – nnnnn

    24. Februar 2017 um 22:40 Uhr

  • Gut zu wissen @nnnnnn

    – Nathan

    24. Februar 2017 um 22:48 Uhr

  • Warum Chrome wichtig?

    – Studiozeit

    24. Februar 2017 um 22:01 Uhr

  • Sowohl Chrome als auch Firefox unterstützen diese Syntax. Nicht sicher über ältere Versionen von IE. Speziell const und die fette Pfeilsyntax könnte Probleme bereiten.

    – Nathan

    24. Februar 2017 um 22:02 Uhr

  • Während Ihre Lösung gut ist, wollte ich auch die Ecmascript5-Version sehen

    – RomanPerechrest

    24. Februar 2017 um 22:03 Uhr

  • IE11 unterstützt const aber keine Pfeilfunktionen. MS Edge unterstützt beides.

    – nnnnn

    24. Februar 2017 um 22:40 Uhr

  • Gut zu wissen @nnnnnn

    – Nathan

    24. Februar 2017 um 22:48 Uhr

1015330cookie-checkKombinieren Sie die Werte zweier Arrays zu einem Objekt

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy