Ändern Sie das Array in Javascript in ein einfacheres Objekt

Ich habe einen einfachen JSON mit einem Array, das weitere Objekte usw. wie folgt enthält:

languagePack:
[
  {
    'key': 'Username',
    'value': 'Benutzername',
    'group': 'default'
  },
  {
    'key': 'Password',
    'value': 'Passwort',
    'group': 'default'
  }
]

Aber was ich wirklich will, ist ein Objekt wie dieses:

languagePack: 
{
    'Username': 'Benutzername',
    'Password': 'Passwort'
}

Daher möchte ich das Array auf einfache Schlüssel-Wert-Paare reduzieren, die sich innerhalb eines Arrays oder sogar eines Objekts befinden (Schlüssel sind eindeutig). Hat jemand eine Idee, wie man dies mit einigen dieser coolen Array-Funktionen reduzieren kann? Ich habe mir nur so etwas wie ein für jedes ausgedacht und das Objekt "von Hand" Eigenschaft für Eigenschaft erstellt, aber ich erinnere mich, dass es einige coole Dinge für das Array gab, wie "Reduzieren", den Spread-Operator (...), Karte, alle, einige usw.

Ich habe es mit so etwas versucht:

var temp = this.languagePack.map(([key, value]) => ({key,value}))
console.log(temp)

Aber das hat mir nur eine Fehlermeldung gebracht TypeError: Invalid attempt to destructure non-iterable instance

Bearbeiten: Alle drei Antworten funktionieren einwandfrei. Vielen Dank.

Grundsätzlich müssen Sie forEachanstelle der mapFunktion verwenden, und dann können Sie dieses Objekt für jedes Schlüssel- und Wertepaar erstellen, das Sie behalten möchten.

Versuchen Sie dies, es wird Ihr Problem lösen.

var temp = {};

this.languagePack.forEach(({key,value}) => {
    temp[key] = value
})

console.log(temp)

Hinweis: Hier verwenden wir kein mapObjekt , da wir kein Array zurückgeben möchten. Daher können wir reducehier die Funktion verwenden, aber ich dachte, dies wäre einfach und leicht zu verstehen, was wir wollen und was wir hier tun.

Mit der Javascript- reduceFunktion können Sie ein leeres Objekt erstellen und jeden Schlüssel und Wert darin einfügen.

const data = [
  {
    'key': 'Username',
    'value': 'Benutzername',
    'group': 'default'
  },
  {
    'key': 'Password',
    'value': 'Passwort',
    'group': 'default'
  }
];

const newData = data.reduce((acc, row) => {
  acc[row.key] = row.value;
  return acc;
}, {});

console.log(newData);

Edit: Netter Vorschlag von Donny Verduijn . Sie können die es6-Destrukturierung verwenden, um die Funktion kürzer zu schreiben.

const newData = data.reduce((acc, { key, value }) => ({ ...acc, [key]: value }), {});

Verwenden Sie mit Array#mapseiner Funktion den Schlüssel und den Wert als Objekt und den Object.assignverdeckten Array-Wert für das Objekt

const languagePack = [ { 'key': 'Username', 'value': 'Benutzername', 'group': 'default' }, { 'key': 'Password', 'value': 'Passwort', 'group': 'default' } ];

var res = Object.assign({},...languagePack.map(({key,value}) => ({[key]:value})))

console.log(res)

Sie können ES6 Mapfür diese Verwendung verwenden Object.fromEntries, um mapzurück zu konvertieren Object.

Weitere Informationen zu Map

let languagePack=
[{
  'key': 'Username',
  'value': 'Benutzername',
  'group': 'default'
},
{
  'key': 'Password',
  'value': 'Passwort',
  'group': 'default'
}];

let map = new Map();

languagePack.forEach((val)=>{
  map.set(val.key, val.value);
})
languagePack = Object.fromEntries(map);
console.log(languagePack);