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}
]
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
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
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