javascript遍历对象的五种方式实例代码

当我们需要遍历JavaScript对象时，有许多种方法可供选择。下面是遍历对象的五种方式以及相应的代码示例:

1. for...in循环

for...in循环适用于遍历对象的属性。它将枚举对象的所有可枚举属性，包括原型链上的属性。

const person = {firstName: 'John', lastName: 'Doe', age: 30};

for (const prop in person) {
  console.log(`${prop}: ${person[prop]}`);
}

输出:

firstName: John
lastName: Doe
age: 30

2. Object.keys()

Object.keys()方法返回一个对象中所有可枚举属性的数组。我们可以使用for...of循环遍历它。

const person = {firstName: 'John', lastName: 'Doe', age: 30};
const keys = Object.keys(person);

for (const key of keys) {
  console.log(`${key}: ${person[key]}`);
}

输出:

firstName: John
lastName: Doe
age: 30

3. Object.getOwnPropertyNames()

Object.getOwnPropertyNames()方法返回一个对象中所有属性的数组，包括不可枚举属性。

const person = {firstName: 'John'};
Object.defineProperty(person, 'age', {
    value: 30,
    enumerable: false
});

const propNames = Object.getOwnPropertyNames(person)
for (const prop of propNames) {
    console.log(`${prop}: ${person[prop]}`);
}

输出:

firstName: John
age: 30

4. Object.entries()

Object.entries()方法返回一个数组，其中包含一个对象的可枚举属性键值对。

const person = {firstName: 'John', lastName: 'Doe', age: 30};
const entries = Object.entries(person);

for (const [key, value] of entries) {
  console.log(`${key}: ${value}`);
}

输出:

firstName: John
lastName: Doe
age: 30

5. Object.values()

Object.values()方法返回一个对象中所有可枚举属性的值的数组。我们可以使用for...of循环遍历它。

const person = {firstName: 'John', lastName: 'Doe', age: 30};
const values = Object.values(person);

for (const value of values) {
  console.log(`${value}`);
}

输出:

John
Doe
30

以上是JavaScript遍历对象的五种方式，可以根据具体的情况选择不同的方式适用。