JavaScript Object.fromEntries() 方法

Object.fromEntries() 语法

Object.fromEntries() 是 JavaScript 的一个静态方法，它用于将一个 “包含键值对的可迭代对象（如二维数组、Map 等）” 转换为一个 “Object对象” 。

Object.fromEntries() 和 Object.entries() 这两个方法的操作是相反的，它们的区别如下。

Object.entries()：将 “对象” 转化为 “可迭代对象”。
Object.fromEntries()：将 “可迭代对象” 转化为 “对象”。

语法：

Object.fromEntries(iterable)

说明：

Object.fromEntries() 方法接收单个参数。

iterable（必选）：包含对象列表的可迭代对象，比如数组、Map 等。

注意: fromEntries() 方法是一个静态方法，它只能被类名（即 Object）调用，而无法被实例调用。

Object.fromEntries() 摘要

属于	JavaScript Object 对象
使用频率	低
官方文档	查看
MDN	查看

Object.fromEntries() 示例

接下来，我们通过几个简单的例子来讲解一下 Object.fromEntries() 方法是如何使用的。

示例 1：Object.fromEntries() 基本用法

运行代码

const obj = {
    name: "Jack",
    age: 24
};
console.log(Object.entries(obj));

const arr = [
    ["name", "Jack"],
    ["age", 24]
];
console.log(Object.fromEntries(arr));

运行结果如下。

[["name", "Jack"], ["age", 24]]
{ name: "Jack", age: 24 }

分析：

从结果可以看出，Object.entries() 和 Object.fromEntries() 的操作是相反的。

示例 2：Object.fromEntries() 将 Map 转为 Object

运行代码

const map = new Map();
map.set("name", "Jack");
map.set("age", 20);

const obj = Object.fromEntries(map);
console.log(obj);

运行结果如下。

{ name: 'Jack', age: 20 }

分析：

如果想要将一个 Map 转换为普通的 Object，Object.fromEntries() 是最简单的方法。

Object.fromEntries() 应用场景

可能小伙伴会问：“Object.fromEntries() 这个方法到底有什么用呢？” 比如下面例子有一个对象，如果想要将对象所有属性的值都乘以 3，此时可以使用 Object.fromEntries() 就可以轻松实现。

示例 3：Object.fromEntries() 的应用

运行代码

const obj1 = {
    a: 1,
    b: 2,
    c: 3
};

const arr = Object.entries(obj1).map(([key, value]) => {
    return [key, value * 3];
});
const obj2 = Object.fromEntries(arr);
console.log(obj2);

运行结果如下。

{ a: 3, b: 6, c: 9 }

分析：

在这个例子中，Object.entries(obj1) 得到的是一个二维数组 [["a", 1], ["b", 2], ["c", 3]]。既然是数组，那么就可以使用 map() 方法来遍历了。需要注意的是，这个二维数组每一个元素又是一个数组。

由于最后需要得到的是一个对象，而 Object.entries(obj1).map() 得到的是一个数组，这个时候使用 Object.fromEntries() 就可以很轻松地将这个 “二维数组” 转换为 “对象” 了。