ES6 中如何使用 Object.values 获取对象的值
在前端开发中我们常常会操作对象及其属性，而 ES6 新增了许多操作对象的语法及方法，其中 Object.values 就是其中之一。它可以用来获取对象的值并返回以数组的形式存储的值列表。本文将详细介绍 Object.values 的使用方法及其指导意义。
使用方法
Object.values(obj) 接收一个参数 obj 作为要操作的对象，返回一个由 obj 中属性的值组成的数组。以下是 Object.values 的使用示例：
const obj = { name: 'John', age: 30, city: 'New York' };
const values = Object.values(obj);
console.log(values);
// Output: ['John', 30, 'New York']从输出结果可以看出，Object.values 返回了一个由对象属性值组成的数组。
Object.values 适用于普通对象及其原型链上的可枚举属性。当接收的参数不是对象，如 null 和 undefined 等时，会抛出 TypeError 类型错误。当需要操作数组时应该使用 Array.prototype.values。
指导意义
Object.values 为我们操作对象提供了一种方便的方式，其主要应用场景如下：
- 获取对象的值
Object.values 可以快速获取对象的值列表。例如，我们可以通过以下方式获取一个数组的最大值：
const array = [5, 6, 2, 1, 10]; const maxValue = Math.max(...array); console.log(maxValue);
该代码的运行结果是 10，因为通过展开运算符和 Math.max 方法取出了数组中的最大值。在这个例子中，Object.values 并未用到。
- 遍历对象的属性值
我们可以结合 for...of 循环和 Object.values 来遍历对象的属性值。以下是一个使用 for...of 循环和 Object.values 遍历对象属性值的示例：
const obj = { name: 'John', age: 30, city: 'New York' };
for (const value of Object.values(obj)) {
console.log(value);
}该代码将会输出以下结果：
John 30 New York
- 替换对象属性名
在一些场景中，我们需要将一个对象的属性名替换为新的属性名。我们可以结合 Object.keys 和 Array.prototype.reduce 方法来实现。以下是一个使用 Object.keys 和 Array.prototype.reduce 方法来替换对象属性名的示例：
const obj = { name: 'John', age: 30, city: 'New York' };
const newObj = Object.keys(obj).reduce((result, key) => {
const newKey = key === 'name' ? 'fullName' : key;
return { ...result, [newKey]: obj[key] };
}, {});
console.log(newObj);该代码将会输出以下结果：
{
fullName: 'John',
age: 30,
city: 'New York'
}在这个例子中，我们并未直接使用 Object.values，但通过 Object.keys 和 Array.prototype.reduce 方法来完成了替换对象属性名的操作。实际上 Object.keys 可以将对象的键名转化为一个数组，而 Array.prototype.reduce 方法可以对数组中每个元素执行一个回调函数，并将其结果累加到一个中间的结果值中，最终返回一个新的对象。
总结
Object.values 是 ES6 新增的一个操作对象属性值的方法，它可以快速获取对象的值列表，并且可以结合其他方法完成一系列操作对象的操作。本文介绍了 Object.values 的使用方法及其指导意义，并提供了相关示例代码。希望读者在日常开发中能够灵活运用该方法，提高自己的开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64cb29ce5ad90b6d041f11a2