ES8 新特性：Object.entries() 方法详解

在 JavaScript 的不断发展过程中，ECMAScript （简称 ES）不断推出各种新的语法和 API，为前端开发提供了更多更便捷的操作方式。其中，ES8 新增的 Object.entries() 方法是一种能够极大简化代码的方法，本文就来详细介绍一下它的用法和特点。

什么是 Object.entries() 方法

Object.entries() 方法是 ECMAScript 新增的一个方法，用于将对象转化为一个二维数组，其中每个元素都包含键和值两个信息。该方法的语法如下：

Object.entries(obj)

这个方法接收一个对象作为参数，返回该对象的键值对数组，其中每个键值对表示为数组的形式，第一个元素为键，第二个元素为值。

Object.entries() 方法的应用

Object.entries() 方法的返回值可以用于遍历对象的属性、获取对象的长度或者取出某个特定键的信息，多用于对对象数据的处理。

对象的遍历

Object.entries() 可以用于遍历一个对象，从而获取对象属性的信息。下面的代码演示了如何使用 Object.entries() 方法遍历对象：

const obj = { "name":"Tom", "age":20, "city":"Shanghai" };
for (const [key, value] of Object.entries(obj)) {
  console.log(`${key}: ${value}`);
}

以上代码输出：

name: Tom
age: 20
city: Shanghai

获取对象的长度

使用 Object.entries() 方法获取对象的长度也是一个较为实用的方法。数组的长度可以通过数组的 length 属性得到，而对象并没有这个属性。但是，我们可以使用 Object.entries() 方法，将对象转化为一个数组，然后使用数组的 length 属性获取其长度。下面是一个简单的示例：

const obj = { "name":"Tom", "age":20, "city":"Shanghai" };
console.log(Object.entries(obj).length); // 3

取出某个特定键的信息

如果需要获取某个具体键的信息，可以先使用 Object.entries() 方法将对象转化为数组，然后使用 find() 方法取出特定键所在的元素，进而获取该键的值。代码如下：

const obj = { "name":"Tom", "age":20, "city":"Shanghai" };
const targetKey = "age";
const targetValue = Object.entries(obj).find(([key, value]) => key === targetKey)[1];
console.log(targetValue); // 20

技巧小提示：将对象转化为 Map 对象

有时候，我们可以将一个对象转化为 Map 对象，以便于更方便的另一种方式去使用。Object.entries() 与 Map 构造函数可以一起使用，来实现将一个对象转化为 Map 对象。实例如下：

const obj = { "name":"Tom", "age":20, "city":"Shanghai" };
const map = new Map(Object.entries(obj));
console.log(map.get("name")); // Tom
console.log(map.get("age")); // 20
console.log(map.get("city")); // Shanghai

总结

Object.entries() 方法是一个简单却实用的方法，在实际的开发过程中，能够大大简化代码，提高代码的可读性和洁净度。掌握 Object.entries() 方法，还能让我们处理 JavaScript 对象时更加得心应手。

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