在 JavaScript 开发中，我们经常遇到需要遍历对象的情况。ES6 中，我们有了 Object.entries() 和 Object.values() 方法，用来遍历对象的键值对和值。在 ES7 中，新增了 Object.keys() 方法，用来获取对象的所有键名。本文将对 Object.keys() 方法进行详细解析和学习，帮助读者更好地掌握前端开发技术。
语法和用法
Object.keys() 方法的语法如下：
Object.keys(obj)
其中，obj 表示需要获取键名的对象。该方法会返回一个由对象的所有可枚举属性的键名组成的数组。如果对象没有任何可枚举属性，则返回空数组。
下面是一个使用示例：
const obj = { name: 'John', age: 18, sex: 'male' }
const keys = Object.keys(obj)
console.log(keys) // ["name", "age", "sex"]深入理解
1. 可枚举属性
在理解 Object.keys() 方法前，我们需要了解对象的可枚举属性。
可枚举属性指的是那些可以通过 for...in 循环、Object.keys() 方法、JSON.stringify() 方法输出的属性。如果一个属性不可枚举，则无法通过这三种方式获取它。
在 JavaScript 中，对象的所有自身属性都是可枚举属性，即 enumerable 为 true。而部分内置对象的原型属性是不可枚举属性，比如 Object.prototype 上的属性。此外，通过 Object.defineProperty() 方法定义的属性，其 enumerable 默认值为 false。我们可以使用该方法定义不可枚举属性。
下面是一个使用 Object.defineProperty() 定义不可枚举属性的示例：
const obj = { name: 'John', age: 18, sex: 'male' }
Object.defineProperty(obj, 'hobby', {
value: 'reading',
enumerable: false
})
console.log(Object.keys(obj)) // ["name", "age", "sex"]2. 遍历顺序
使用 Object.keys() 方法获取对象的键名时，返回的键名数组与遍历顺序无关，即无法保证数组中的键名与其在对象中出现的顺序一致。
下面是一个使用 for...in 循环遍历对象的简单示例：
const obj = { name: 'John', age: 18, sex: 'male' }
for (let key in obj) {
console.log(key)
}
// name
// age
// sex通过 for...in 循环遍历对象时，输出的顺序是无法保证的。如果要保证遍历顺序的一致性，建议使用 Map 对象，它可以保证键值对的插入顺序。
3. 应用场景
Object.keys() 方法常用于遍历对象的键名，并进行一些操作，例如：
- 判断对象是否有某个键名；
- 遍历对象并对其值进行操作，例如对对象的值求和。
下面是一个使用 Object.keys() 方法判断对象是否有某个键名的示例：
const obj = { name: 'John', age: 18, sex: 'male' }
const hasName = Object.keys(obj).includes('name')
console.log(hasName) // true下面是一个使用 Object.keys() 方法遍历对象并对其值进行操作的示例：
const obj = { a: 1, b: 2, c: 3 }
let sum = 0
Object.keys(obj).forEach(key => {
sum += obj[key]
})
console.log(sum) // 6总结
本文详细介绍了 ES7 中的 Object.keys() 方法，让读者了解了该方法的语法和用法，以及可枚举属性、遍历顺序等相关概念。同时，我们还通过示例代码演示了该方法的应用场景，希望读者对该方法有更深入的理解和掌握。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64cf0e6eb5eee0b5256882ea