使用 ES9 的 Object.entries 和 Object.fromEntries 将数据转换为对象

前言

在前端开发中,我们经常需要将数据从一种格式转换为另一种格式。其中,将数组转换为对象是一种常见的需求。

在 ES6 中,我们可以使用 Object.assign 方法将数组转换为对象。但是,这种方法需要手动创建一个空对象,并且需要遍历数组中的每个元素。在 ES9 中,我们可以使用 Object.entriesObject.fromEntries 方法更方便地将数组转换为对象。

Object.entries

Object.entries 方法可以将一个对象的所有可枚举属性转换为一个由 [key, value] 数组组成的数组。例如:

const obj = { foo: 'bar', baz: 42 };
const entries = Object.entries(obj);
console.log(entries); // [['foo', 'bar'], ['baz', 42]]

Object.fromEntries

Object.fromEntries 方法可以将一个由 [key, value] 数组组成的数组转换为一个对象。例如:

const entries = [['foo', 'bar'], ['baz', 42]];
const obj = Object.fromEntries(entries);
console.log(obj); // { foo: 'bar', baz: 42 }

示例

假设我们有一个数组,其中包含多个对象,每个对象都有一个 id 属性和一个 name 属性。我们想要将这个数组转换为一个以 id 为键,以 name 为值的对象。我们可以使用 Object.fromEntries 方法完成这个转换:

const arr = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' },
];

const obj = Object.fromEntries(arr.map(item => [item.id, item.name]));

console.log(obj); // { 1: 'Alice', 2: 'Bob', 3: 'Charlie' }

总结

使用 Object.entriesObject.fromEntries 方法可以更方便地将数组转换为对象。这些方法在处理数据时非常有用,尤其是在处理大量数据时。在实际开发中,我们可以根据需要灵活使用这些方法,提高代码的可读性和可维护性。

来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/65c42c27add4f0e0ffe9da16