如何将对象数组转换为一个特定的对象？

Question

所以，我在最后一次面试中遇到了一个非常微小但对我来说很难的任务。我只是对如何解决它感到好奇。我认为我们需要在这个任务中实现递归，但我不太清楚。

任务如下：

let arr = [{name: 'width', value: 300}, {name: 'height', value: 100}];

在输出时我们必须拥有：

let obj = {width:300, height: 100};

数组对象的数量可以是无限的。

附注: 如果您能提供如何完成此任务的知识链接，我会很高兴。

谢谢。

- Max Wolfen

---

OP，我的回答如下，保持了每个对象的高度/宽度配对，就像你想要的那样。如果你需要更多帮助，请告诉我。你尝试过这里的其他答案吗？ - Nerdi.org

Answer 1

使用函数reduce的替代方法

简要说明

• 函数Array.prototype.reduce循环数组并对每个对象应用处理程序。
• 累加器a将包含每次迭代的结果。
• 函数converter接收累加器和当前对象。
• Object.assign(a, {[name]: value})将一个新属性分配给当前累加器。
• 计算属性名{[name]: value}，该代码将构建一个对象，如下所示：

{ width: 300 }

let arr = [{name: 'width', value: 300},{name: 'height', value: 100}],
    converter = (a, {name, value}) => (Object.assign(a, {[name]: value})),
    obj = arr.reduce(converter, {});

console.log(obj);

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

<script src="https://codepen.io/synthet1c/pen/KyQQmL.js"></script>

- Ele

---

代码不错，但这样宽度和高度不就各自独立了吗？我认为 OP 想要将宽度和高度配对，这样原始数组中的两个对象就会被合并。因此，原始数组的长度应该是最终输出长度的两倍。我相信 OP 希望每对原始数组中的对象都有一个带有高度和宽度的对象作为输出结果。 - Nerdi.org

@Nerdi.org的答案符合原帖作者的要求。 - Ele

但这就是我要说的... OP有一个无限对象的数组。预期的结果是将原始数组中的宽度/高度维度对（来自2个对象）组合在一个单独的对象中。这些是要求，据我所知，这里大部分答案完全忽略了他想要将值配对在一起，而不是列为单独的对象。如果我误解了您的代码如何实现这一点，我很抱歉 - 我只是想澄清，因为这里有很多答案根本不能得到OP想要的结果。 - Nerdi.org

@Nerdi.org，但输入是一个数组。操作者只想从该数组构建一个大对象，其中包含嵌套的对象。 - Ele

@MaxWolfen，你能解释一下你遇到的错误是什么吗？ - Ele

Answer 2

使用数组 .reduce 方法可能是一个不错的选择。从一个空对象开始，对于每个数组项，使用该键和值向对象添加一个条目。例如：

let arr = [{name: 'width', value: 300}, {name: 'height', value: 100}];

let result = arr.reduce((combo, item) => {
    combo[item.name] = item.value;
    return combo;
}, {});

console.log(result);

- CRice

Answer 3

首先，在数组中的两个对象之间缺少逗号 :)

每当你想要处理一个数组并得出一个单一值时，你就需要使用array.reduce。你可以选择方向（reduce或reduceRight）和累加器函数来生成所需的值（或对象）。

- Traveling Tech Guy

Answer 4

另一种使用reduce、解构和对象展开运算符的方法：

const src = [{
  name: 'width',
  value: 300
}, {
  name: 'height',
  value: 100
}]

const reducer = (acc, { name, value }) => ({
  ...acc,
  ...{ [name]: value }
});


const out = src.reduce(reducer, {});

console.log(out);

- Karen Grigoryan

Answer 5

var len = arr.length, 

var newA = []; 
let width, height, item; 
for(var x = 0; x < len; x+=2){ //add 2 for pair loop because width/height in diff array objects 
 item.width = arr[x].value;
 item.height = arr[x+1].value; 
 newA.push(item); 
 // newA = [{width:value, height:value}, {width:value, height:value}];
}
console.log(newA);

这应该可以将宽度和高度分组到您的最终数组中 :)

如果您只想要一个大对象（请确保没有名称重复！）...

var len = arr.length, 
obj = {}; 
for(var x = 0; x < len; x++){ 
 obj[arr[x].name] = arr[x].value;
} 
console.log(obj);

- Nerdi.org

Answer 6

你也可以使用forEach()来解决它。

let arr = [{name: 'width', value: 300},{name: 'height', value: 100}];
let obj = {};
arr.forEach(val=>obj[val.name]=val.value);

- Mahipal

---

使用for()循环会更快。 - Nerdi.org

Answer 7

您可以通过使用方括号表示法，在数组中添加键值对来创建对象：

let arr = [{name: 'width', value: 300},{name: 'height', value: 100}];
 let obj = {};
 arr.forEach(pair => obj[pair.name] = pair.value)
 console.log(obj);

- Pac0

Answer 8

你可以使用 Array.map() 来创建一个对象数组，形式为 { [name]: value }，并通过 展开运算符 合并它们到一个单一的对象中，使用 Object.assign()：

const arr = [{name: 'width', value: 300}, {name: 'height', value: 100}];

const object = Object.assign(...arr.map(({ name, value }) => ({ [name]: value })));

console.log(object);

- Ori Drori

Answer 9

你可以只用一个for循环来解决这个问题：

var obj = {};
for (var i=0; i<arr.length; i++){
    obj[arr[i].name] = arr[i].value;
}

- Dan Raps