理解 ECMAScript 2017 (ES8) 中新的 Object.values() 和 Object.entries() 函数

前言

ECMAScript 2017 (ES8) 是 JavaScript 的最新版本，它在语言本身的基础上增加了一些新的功能和特性。其中，Object.values() 和 Object.entries() 函数是 ES8 中新增的两个函数。本文将详细介绍这两个函数的使用方法、作用以及示例代码。

Object.values() 函数

Object.values() 函数返回一个给定对象所有可枚举属性的值的数组。这个数组的顺序与使用 for...in 循环遍历对象时返回的顺序相同。

语法

Object.values(obj)

参数

• obj：要返回其枚举自身属性的对象。

返回值

一个包含对象所有可枚举属性值的数组。

示例代码

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

Object.entries() 函数

Object.entries() 函数返回一个给定对象自身可枚举属性的键值对数组。这个数组的顺序与使用 for...in 循环遍历对象时返回的顺序相同。

语法

Object.entries(obj)

参数

• obj：要返回其可枚举属性的键值对的对象。

返回值

一个包含对象自身可枚举属性的键值对数组。

示例代码

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

深入理解

Object.values() 和 Object.entries() 函数在实际开发中具有很大的作用。它们可以用于将对象转换为数组，方便进行数据处理和遍历。同时，它们也可以用于将对象转换为 Map 数据结构，方便进行键值对的操作和遍历。

将对象转换为数组

使用 Object.values() 函数可以将一个对象的所有可枚举属性的值转换为一个数组。例如，下面的代码将对象转换为数组并进行遍历：

const obj = { a: 1, b: 2, c: 3 };
const arr = Object.values(obj);
for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}

使用 Object.entries() 函数可以将一个对象的所有可枚举属性的键值对转换为一个数组。例如，下面的代码将对象转换为数组并进行遍历：

const obj = { a: 1, b: 2, c: 3 };
const arr = Object.entries(obj);
for (let i = 0; i < arr.length; i++) {
  console.log(arr[i][0], arr[i][1]);
}

将对象转换为 Map 数据结构

使用 Object.entries() 函数可以将一个对象的所有可枚举属性的键值对转换为一个 Map 数据结构。例如，下面的代码将对象转换为 Map 数据结构并进行遍历：

const obj = { a: 1, b: 2, c: 3 };
const map = new Map(Object.entries(obj));
map.forEach((value, key) => {
  console.log(key, value);
});

总结

Object.values() 和 Object.entries() 函数是 ECMAScript 2017 (ES8) 中新增的两个函数，它们可以用于将对象转换为数组和 Map 数据结构，方便进行数据处理和遍历。在实际开发中，我们可以根据需要灵活地使用它们。

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