ES9 之 Object.entries() 手册

ES9 的 Object.entries() 方法是一个非常有用的方法，它可以将对象转化为一个包含其 key 和 value 的数组，并且可以很方便地使用 for of 循环来遍历数组。本篇文章将详细介绍 Object.entries() 的使用方法及其在实际编程中的应用。

基础使用

Object.entries() 方法将一个对象作为参数，返回一个其 key 和 value 的数组。例如：

const obj = { a: 1, b: 2, c: 3 };
const arr = Object.entries(obj);
console.log(arr);

输出结果为：

[ [ 'a', 1 ], [ 'b', 2 ], [ 'c', 3 ] ]

可以看到，Object.entries() 将对象 obj 转化成了一个数组，这个数组中包含了其 key 和 value 的信息。

for of 循环遍历

Object.entries() 与 for of 循环搭配使用非常方便，可以遍历对象的所有 key 和 value。例如：

const obj = { a: 1, b: 2, c: 3 };
for (const [key, value] of Object.entries(obj)) {
  console.log(`${key}: ${value}`);
}

输出结果为：

a: 1
b: 2
c: 3

应用案例

Object.entries() 在实际编程中有非常广泛的应用场景，包括但不限于以下几个方面。

使用数组解构获取对象的键值

Object.entries() 和数组解构搭配使用可以非常方便地获取对象的键值，例如：

const obj = { a: 1, b: 2, c: 3 };
const [aKey, aValue] = Object.entries(obj)[0];
console.log(`${aKey}: ${aValue}`);

输出结果为：

a: 1

将对象转化为 URLSearchParams

URLSearchParams 是 Web API 中的一个接口，可以方便地解析和构建 URL 的查询参数。Object.entries() 可以将对象转化为 URLSearchParams，例如：

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

输出结果为：

a=1&b=2&c=3

使用 for of 循环遍历 Map 对象

Map 对象是 ES6 中新增的数据结构，可以用来存储键值对。Object.entries() 可以将 Map 对象的键值对转化为一个数组，然后可以使用 for of 循环遍历这个数组，例如：

const map = new Map([['a', 1], ['b', 2], ['c', 3]]);
for (const [key, value] of Object.entries(map)) {
  console.log(`${key}: ${value}`);
}

输出结果为：

a: 1
b: 2
c: 3

总结

Object.entries() 是一个非常有用的方法，可以方便地将对象转化为一个包含其 key 和 value 的数组，并可以使用 for of 循环遍历数组。同时，Object.entries() 还有很多广泛的应用场景，例如使用数组解构获取对象的键值、将对象转化为 URLSearchParams、使用 for of 循环遍历 Map 对象等。我们可以在日常编程中灵活应用 Object.entries() 方法，提高代码的可读性和实用性。

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