当前位置：首页 > article >正文

#Js篇：map结构转普通js普通对象

article 2025/3/10 21:16:49

在 JavaScript 中，将 Map 转换为普通对象（即 { key: value } 形式的对象）有几种方法。以下是几种常见的方法：

Object.fromEntries()方法是Object.entries()的逆操作，用于将一个键值对数组转为对象。

Object.fromEntries([
  ['foo', 'bar'],
  ['baz', 42]
])
// { foo: "bar", baz: 42 }

该方法的主要目的，是将键值对的数据结构还原为对象，因此特别适合将 Map 结构转为对象。

方法一：使用 Object.fromEntries

Object.fromEntries 方法可以将一个可迭代对象（如 Map）转换为一个对象。

const map = new Map([
  ['name', 'Alice'],
  ['age', 30],
  ['isStudent', false]
]);
const obj = Object.fromEntries(map);
console.log(obj); // { name: 'Alice', age: 30, isStudent: false }

方法二：使用 Array.from 和 reduce

你可以先将 Map 转换为数组，然后使用 reduce 方法将其转换为对象。

const map = new Map([
  ['name', 'Alice'],
  ['age', 30],
  ['isStudent', false]
]);

const obj = Array.from(map).reduce((acc, [key, value]) => {
  acc[key] = value;
  return acc;
}, {});
console.log(obj); // { name: 'Alice', age: 30, isStudent: false }

方法三：使用 for…of 循环

你也可以使用 for…of 循环手动将 Map 转换为对象。

const map = new Map([
  ['name', 'Alice'],
  ['age', 30],
  ['isStudent', false]
]);

const obj = {};
for (const [key, value] of map) {
  obj[key] = value;
}
console.log(obj); // { name: 'Alice', age: 30, isStudent: false }

方法四：使用扩展运算符和 Object.assign

虽然这种方法不如前几种简洁，但也可以实现相同的效果。

const map = new Map([
  ['name', 'Alice'],
  ['age', 30],
  ['isStudent', false]
]);

const obj = Object.assign({}, ...Array.from(map, ([k, v]) => ({ [k]: v })));

console.log(obj); // { name: 'Alice', age: 30, isStudent: false }