如何将一个数组转换为对象

Question

我希望你能将以下内容翻译成中文：

let myArray = [ {city: "NY"}, {status: 'full'} ];

转换为：

let myObj = { city: "NY", status: 'full' };

当我尝试这个时：

let newObj = {};
for (var i = 0; i < myArray.length; i++) {
  (function(x) {
    newObj = Object.assign(myArray[i]);
  })(i);
}

它将最后一对键值分配给对象。

- Hamed Mamdoohi

---

您请求的对象无效；您不能拥有{ { city: 'NY' } }。 - Explosion Pills

Answer 1

将数组使用展开运算符(Spread)传递给 Object#assign：

const myArray = [ {city: "NY"}, {status: 'full'} ];

const myObj = Object.assign({}, ...myArray);

console.log(myObj);

注意：将其分配到一个空对象中。如果省略空对象，则原始数组的第一个元素将被改变（所有内容将合并到其中）。

- Ori Drori

---

是的，那就是我想说的。那是一个错误。 - Hamed Mamdoohi

值得注意的是，展开运算符在IE 11中不可用。 - zfrisch

在IE11中无法使用Object.assign，因此为spread语法寻找解决方法并不合理。 - Nina Scholz

@NinaScholz - 你说得对。我高估了IE11 :) - Ori Drori

Answer 2

您还可以使用Array.reduce()，这将为您提供更精细的控制：

const myArray = [
  { city: 'NY', color: 'blue', rodents: { small: false, medium: false, large: true } },
  { status: 'full', color: 'red' },
  { sandwich: 'flavourful' },
]
    
// item is each object in your array
const reduced = myArray.reduce((newObj, item) => {
  // existing props will be overwritten by newer object entries in the array
  // this example is same as Object.assign spread with right to left precedence,
  // until you want more custom logic
  Object.keys(item).forEach((key) => { newObj[key] = item[key] })
  return newObj
}, {})
    
console.log(reduced)
// you will see `red` overwrite `blue`

编辑：经过一年的检查，我注意到这个答案并没有优化能力以进行深克隆或深合并。如果你正在不可变地工作，请仔细研究这些方面，并小心复制或打破引用。

在上面的示例中，没有任何问题，因为所有值都是原始值。

- agm1984

Answer 3

我倾向于同意Ori的观点，即您的问题似乎是关于创建索引对象的，这通常不是一个好的方案，但如果必须使用数字作为键来标识您的对象，您可以按照以下方式实现：

let newObj = {};
myArray.forEach((val, index) => { newObj[index] = val });

- D Lowther

---

是的，那就是我的意思。那是一个错误。 - Hamed Mamdoohi

Answer 4

let myArray = [ {city: "NY"}, {status: 'full'} ];

let newObj = myArray.reduce((acc, curr) => {
    Object.keys(curr).forEach(val => {
    acc[val] = curr[val]
  })
  return acc
}, {})

console.log(newObj)

根据caniuse.com，这种语法在IE中受支持。

- Cristian Gherghel

---

一段没有任何上下文的代码块并不是最好的答案。请考虑扩展说明。即使从问题的上下文中，"IE Supported" 的含义也不清楚。 - user1531971

使用 map 而不使用结果只是遍历数组的一种不好的模式。你可以使用 forEach。 - Nina Scholz