在 JavaScript 中,有多种方式可以遍历对象的属性。以下是一些常见的方法:

1. for...in 循环:

for...in 循环遍历对象的可枚举属性,包括自身属性和继承的属性。

const person = {
  name: 'John',
  age: 30,
  job: 'Engineer'
};

for (let key in person) {
  console.log(key, person[key]);
}

2. Object.keys() 方法:

Object.keys() 方法返回一个包含对象所有可枚举属性的数组,然后可以使用数组的 forEach 方法遍历。

const person = {
  name: 'John',
  age: 30,
  job: 'Engineer'
};

Object.keys(person).forEach(key => {
  console.log(key, person[key]);
});

3. Object.values() 方法:

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

const person = {
  name: 'John',
  age: 30,
  job: 'Engineer'
};

Object.values(person).forEach(value => {
  console.log(value);
});

4. Object.entries() 方法:

Object.entries() 方法返回一个包含对象所有可枚举属性的 [key, value] 数组的数组。

const person = {
  name: 'John',
  age: 30,
  job: 'Engineer'
};

Object.entries(person).forEach(([key, value]) => {
  console.log(key, value);
});

5. for...of 循环(适用于可迭代对象):

for...of 循环适用于可迭代对象,可以遍历对象的值。

const person = {
  name: 'John',
  age: 30,
  job: 'Engineer'
};

for (const value of Object.values(person)) {
  console.log(value);
}

除了上面提到的几种常见的方法外,还有一些其他方法可以用于遍历对象的属性:

6. Object.getOwnPropertyNames() 方法:

Object.getOwnPropertyNames() 方法返回一个包含对象所有自身属性(不包括继承属性)的数组。

const person = {
  name: 'John',
  age: 30,
  job: 'Engineer'
};

Object.getOwnPropertyNames(person).forEach(key => {
  console.log(key, person[key]);
});

7. Reflect.ownKeys() 方法:

Reflect.ownKeys() 方法返回一个包含对象自身所有属性(包括可枚举和不可枚举属性,以及 Symbol 类型的属性)的数组。

const person = {
  name: 'John',
  age: 30,
  [Symbol('hobby')]: 'Coding'
};

Reflect.ownKeys(person).forEach(key => {
  console.log(key, person[key]);
});

8. forEach 方法(仅适用于数组):

如果对象是数组,你可以直接使用数组的 forEach 方法进行遍历。

const numbers = [1, 2, 3, 4, 5];

numbers.forEach(number => {
  console.log(number);
});

这种方法适用于数组,但不适用于普通对象。

选择遍历对象属性的方法取决于你的需求和对遍历的精度的要求。通常情况下,for...in 循环是最常用的方法,但需要注意它会遍历对象的原型链上的属性。如果只需要遍历对象自身的属性,可以结合使用 hasOwnProperty 方法来进行检查。

Logo

Agent 垂直技术社区,欢迎活跃、内容共建。

更多推荐