在前端开发中，经常需要将 JavaScript 对象转换为数组。ECMAScript 2017 引入的 Object.values() 方法可以方便地将对象的值转换为数组。本文将介绍该方法的使用和应用。
Object.values() 方法概述
Object.values() 是一个静态方法，它接收一个对象作为参数，并返回该对象所有属性值组成的数组。如果对象不是 Object 类型，该方法将抛出 TypeError 异常。
该方法的语法如下：
Object.values(obj)
其中，obj 表示要获取属性值的对象。返回值是一个数组，它包含了 obj 所有自身可枚举属性（不包括其原型链上的属性）的值。数组元素的顺序与通过 for...in 循环遍历对象时访问属性的顺序相同。
如果 obj 不是对象类型，则 Object.values() 方法会将其强制转换为对象类型，并返回一个包含一个元素的数组，该元素的值为被强制转换后的对象。
Object.values() 方法示例
假设有以下一个对象：
const person = {
name: 'Alice',
age: 24,
gender: 'female'
};使用 Object.values() 方法将该对象的属性值转换为数组：
const values = Object.values(person); console.log(values); // 输出：['Alice', 24, 'female']
该代码输出一个包含三个元素的数组，分别是该对象的 name、age 和 gender 属性的值。
Object.values() 方法适用场景
Object.values() 方法可以应用于许多场景中。下面是一些常见的用例：
1. 遍历对象属性
Object.values() 方法提供了一种简单的方法遍历对象属性并执行特定操作。例如，我们可以遍历一个带有学生身份证号的对象，并将所有身份证号码存储到数组中：
-- -------------------- ---- ------- ----- -------- - - ------ - --- ------ -- ---- - --- ------ -- -------- - --- ------ - -- ----- --- - ----------------------------------- -- ------------ ----------------- -- ----------- ------- -------
2. 过滤对象属性
Object.values() 方法还可以用于过滤对象的属性值。例如，在以下代码中，我们过滤出所有年龄在 18 到 30 之间的对象属性：
-- -------------------- ---- -------
----- ------- - -
------ - ---- --- ------- -------- --
---- - ---- --- ------- ------ --
-------- - ---- --- ------- ------ -
--
----- ------------ - ------------------------------------ -- ---------- -- -- -- ---------- -- ----
--------------------------
-- --- -- ---- --- ------- -------- -- - ---- --- ------- ------ --3. 获取对象属性的总和
Object.values() 方法还可以用于计算对象属性的总和。例如，我们可以将一个带有数值属性的对象中的所有数值相加：
-- -------------------- ---- ------- ----- ------ - - ------ ----- ------- ----- ------- ---- -- ----- ---------- - ---------------------------------- ------ -- --- - ------- ------------------------ -- -------
该代码输出了一个数字，表示对象中所有数值属性的总和。
结论
Object.values() 是一种方便、快捷且通用的方法，可将 ECMAScript 2017 引入的新功能应用于将 JavaScript 对象数据转换为数组。Object.values() 方法提供了许多优秀的特性，并且可以与其他 JavaScript 中的函数组合使用以创建更复杂的行为。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/672d076fddd3a70eb6d9ad79