ES6 中的 Object.keys() 和 Object.values() 用法详解

在 JavaScript 中，Object 是一种非常常用的数据类型。在 ES6 中，新增了 Object.keys() 和 Object.values() 两个方法，它们可以帮助我们更方便地操作 Object 类型的数据。本文将详细介绍这两个方法的使用方法和意义。

Object.keys()

Object.keys() 方法返回一个由一个给定对象的自身可枚举属性组成的数组，数组中属性名的排列顺序和使用该对象的 for...in 循环遍历该对象时返回的顺序一致。

语法

Object.keys(obj)

参数

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

返回值

一个表示给定对象的所有可枚举属性的字符串数组。

示例

// javascriptcn.com 代码示例
const obj = {
  name: '张三',
  age: 18,
  gender: 'male'
}

const keys = Object.keys(obj)

console.log(keys) // ["name", "age", "gender"]

Object.values()

Object.values() 方法返回一个给定对象自身的所有可枚举属性值的数组。

语法

Object.values(obj)

参数

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

返回值

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

示例

// javascriptcn.com 代码示例
const obj = {
  name: '张三',
  age: 18,
  gender: 'male'
}

const values = Object.values(obj)

console.log(values) // ["张三", 18, "male"]

应用场景

Object.keys() 和 Object.values() 方法可以帮助我们更方便地遍历 Object 类型的数据。比如，我们可以使用 Object.keys() 方法获取一个对象的所有属性名，然后使用 forEach() 方法遍历这些属性名，再根据属性名获取对应的属性值，从而实现对对象的遍历。

// javascriptcn.com 代码示例
const obj = {
  name: '张三',
  age: 18,
  gender: 'male'
}

const keys = Object.keys(obj)

keys.forEach((key) => {
  const value = obj[key]
  console.log(`${key}: ${value}`)
})

输出结果为：

name: 张三
age: 18
gender: male

总结

Object.keys() 和 Object.values() 方法是 ES6 中非常实用的方法，它们可以帮助我们更方便地遍历 Object 类型的数据。在实际开发中，我们可以根据具体的需求选择使用这两个方法来实现对对象的操作。

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