Question

我有一个简单的JSON，其中包含一个包含其他对象等的数组，如下所示：

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

但是我真正想要的是这样的对象：

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

因此，我想将数组简化为数组甚至对象内的简单键值对（键是唯一的）。有谁知道如何通过一些很棒的数组函数来减少这种情况？我只为每个对象创建了一个类似的东西，并为属性构建了“手工”对象的属性，但是我记得数组中有一些很棒的东西，例如“ reduce”，散布运算符（...），map，每个，一些，等等。

我用类似的东西尝试过

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

但这只会给我一条错误消息TypeError: Invalid attempt to destructure non-iterable instance

编辑：所有三个答案都工作得很好。谢谢。

Answer 1

基本上，您需要使用forEach而不是map函数，然后可以将该对象构建为要保留的任何键，值对。

尝试一下，它将解决您的问题。

var temp = {};

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

console.log(temp)

注意：在这里，我们不使用map，因为我们要返回对象而不是数组，因此，我们可以在此处使用reduce函数，但是我认为这将很容易理解我们想要什么以及我们在这里做什么。

Answer 2

您可以使用JavaScript reduce函数创建一个空对象并将每个键和值放入其中。

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);

编辑： Donny Verduijn 的好建议。您可以使用es6解构来缩短函数的编写时间。

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

Answer 3

与Array#map一起使用，将键和值创建为对象，并将Object.assign隐式数组值创建为对象

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)

Answer 4

您可以使用ES6 Map，将Object.fromEntries转换回map。

有关Map

的更多信息

Object

将javascript中的数组更改为更简单的对象

4 个答案: