使用 ES9 中的 Object.fromEntries() 方法转换数据结构-JavaScript中文网-JavaScript教程资源分享门户

在前端开发中，我们经常需要对数据结构进行转换操作。在 ES9 中，新增了一个方法 Object.fromEntries()，可以非常方便地将一个由键值对组成的数组转换为一个对象。本文将介绍 Object.fromEntries() 的使用方法，以及其在实际开发中的应用。

Object.fromEntries() 的使用方法

Object.fromEntries() 方法接受一个由键值对组成的数组作为参数，返回一个由这些键值对组成的对象。例如：

const arr = [['a', 1], ['b', 2], ['c', 3]];
const obj = Object.fromEntries(arr);
console.log(obj); // {a: 1, b: 2, c: 3}

在上面的例子中，我们将一个由键值对组成的数组 arr 转换为了一个对象 obj。可以看到，转换后的对象的键值对与原数组中的键值对一一对应。

需要注意的是，如果数组中有重复的键名，则后面的值会覆盖前面的值。例如：

const arr = [['a', 1], ['b', 2], ['a', 3]];
const obj = Object.fromEntries(arr);
console.log(obj); // {a: 3, b: 2}

在上面的例子中，由于数组中有两个键名为 'a' 的键值对，因此后面的值 3 覆盖了前面的值 1。

Object.fromEntries() 的应用

将 Map 转换为对象

在 JavaScript 中，Map 是一种常见的数据结构，它可以存储任意类型的键和值，并且保持插入顺序。在实际开发中，我们可能需要将一个 Map 转换为对象。这时，就可以使用 Object.fromEntries() 方法。例如：

const map = new Map([['a', 1], ['b', 2], ['c', 3]]);
const obj = Object.fromEntries(map);
console.log(obj); // {a: 1, b: 2, c: 3}

在上面的例子中，我们将一个键为 'a'、值为 1，键为 'b'、值为 2，键为 'c'、值为 3 的 Map 转换为了一个对象。

将对象转换为 URL 查询字符串

在实际开发中，我们可能需要将一个对象转换为 URL 查询字符串，以便将其作为 GET 请求的参数。这时，就可以使用 Object.entries() 方法和 Array.prototype.map() 方法将对象转换为一个由键值对组成的数组，然后再使用 Object.fromEntries() 方法将数组转换为一个对象。例如：

const obj = {a: 1, b: 2, c: 3};
const queryString = new URLSearchParams(Object.entries(obj)).toString();
console.log(queryString); // 'a=1&b=2&c=3'

在上面的例子中，我们将一个键为 'a'、值为 1，键为 'b'、值为 2，键为 'c'、值为 3 的对象转换为了一个 URL 查询字符串。

总结

Object.fromEntries() 方法可以非常方便地将一个由键值对组成的数组转换为一个对象。在实际开发中，它可以用于将 Map 转换为对象，以及将对象转换为 URL 查询字符串等场景。需要注意的是，如果数组中有重复的键名，则后面的值会覆盖前面的值。

希望本文对大家理解 Object.fromEntries() 方法有所帮助。

来源：JavaScript中文网，转载请注明来源本文地址：https://www.javascriptcn.com/post/657aba8ad2f5e1655d52e639