ES11 中新增的 Object.fromEntries 方法的使用技巧-JavaScript中文网-JavaScript教程资源分享门户

ES11 是 JavaScript 的最新版本，它在 Object 对象中新增了一个非常实用的方法：Object.fromEntries。这个方法可以将一个键值对的数组转换成一个对象。在前端开发中，我们经常需要将数组转换为对象，这时候 Object.fromEntries 就可以派上用场了。

Object.fromEntries 方法的基本用法

Object.fromEntries 方法的基本用法非常简单，只需要将一个由键值对组成的数组作为参数传入即可，例如：

const arr = [['name', 'Tom'], ['age', 18]];
const obj = Object.fromEntries(arr);
console.log(obj);

输出结果为：

{ name: "Tom", age: 18 }

除了基本用法，Object.fromEntries 方法还有很多深度应用，下面我们来一一介绍。

在前端开发中，我们经常需要将 URLSearchParams 对象转换为对象，这时候 Object.fromEntries 就可以派上用场了。例如：

const params = new URLSearchParams('name=Tom&age=18');
const obj = Object.fromEntries(params);
console.log(obj);

输出结果为：

{ name: "Tom", age: "18" }

Map 对象是 ES6 中新增的数据结构，它可以存储键值对，并且键可以是任意类型。在前端开发中，我们经常需要将 Map 对象转换为对象，这时候 Object.fromEntries 就可以派上用场了。例如：

const map = new Map([['name', 'Tom'], ['age', 18]]);
const obj = Object.fromEntries(map);
console.log(obj);

输出结果为：

{ name: "Tom", age: 18 }

在前端开发中，我们经常需要将对象转换为数组，这时候 Object.fromEntries 就可以派上用场了。例如：

const obj = { name: 'Tom', age: 18 };
const arr = Object.entries(obj);
console.log(arr);

输出结果为：

[["name", "Tom"], ["age", 18]]

在前端开发中，我们经常需要将数组转换为对象，并进行数据处理，这时候 Object.fromEntries 就可以派上用场了。例如：

const arr = [['name', 'Tom'], ['age', 18]];
const obj = Object.fromEntries(arr.map(([key, value]) => [key, value + 1]));
console.log(obj);

输出结果为：

{ name: "Tom", age: 19 }

Object.fromEntries 方法在前端开发中非常实用，它可以将一个键值对的数组转换成一个对象，并且可以进行深度应用，例如将 URLSearchParams 对象、Map 对象、对象、数组等进行转换和处理。使用 Object.fromEntries 方法可以让我们的代码更加简洁、优雅。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/663adbf8d3423812e48ea557