ES7 的 Object.values() 和 Object.entries() 方法详解

在 ES7 中，JavaScript 新增了两个方法：Object.values() 和 Object.entries()，它们都是用来处理对象的方法。本文将详细介绍这两个方法的用法和意义，并提供一些示例代码供读者参考。

Object.values() 方法

Object.values() 方法是用来返回一个对象的所有属性值的数组。它的语法如下：

Object.values(obj)

其中，obj 表示要返回属性值的对象。该方法返回一个数组，该数组包含了 obj 对象的所有属性值，其中属性值的顺序与对象属性的顺序一致。

下面是一个示例代码：

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

Object.entries() 方法

Object.entries() 方法是用来返回一个对象的所有属性的键值对数组。它的语法如下：

Object.entries(obj)

其中，obj 表示要返回属性的对象。该方法返回一个数组，该数组包含了 obj 对象的所有属性的键值对，其中每个键值对都是一个数组，第一个元素是属性的名称，第二个元素是属性的值。

下面是一个示例代码：

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

Object.values() 和 Object.entries() 的应用

Object.values() 和 Object.entries() 方法的应用场景很多，下面列举一些常见的应用：

1. 遍历对象

Object.values() 和 Object.entries() 方法可以帮助我们遍历对象，例如：

// javascriptcn.com 代码示例
const obj = { a: 1, b: 2, c: 3 };
for (const value of Object.values(obj)) {
  console.log(value);
}
// 1
// 2
// 3

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

2. 转换对象为数组

有时候我们需要将一个对象转换为数组，可以使用 Object.values() 或 Object.entries() 方法，例如：

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

3. 求对象的属性值之和

Object.values() 方法可以方便地求对象的属性值之和，例如：

const obj = { a: 1, b: 2, c: 3 };
const sum = Object.values(obj).reduce((acc, cur) => acc + cur, 0);
console.log(sum); // 6

总结

Object.values() 和 Object.entries() 方法是 ES7 新增的两个方法，它们都是用来处理对象的方法。Object.values() 方法返回一个包含对象所有属性值的数组，Object.entries() 方法返回一个包含对象所有属性的键值对数组。这两个方法可以帮助我们遍历对象、转换对象为数组以及求对象的属性值之和等。

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