JavaScript遍历对象数组获取属性值的四种常用方法

作者：函数茶馆

时间：2026-10-30

本文介绍在JavaScript中遍历对象数组并提取属性值的四种常用方式，包括for循环、for...of循环、forEach方法和map方法。通过具体代码示例，展示如何高效访问对象属性，并补充使用map直接返回指定值生成新数组的技巧。

文章目录

前言

在JavaScript开发中，遍历对象数组以提取特定属性值是一项基础且高频的操作。本文主要介绍四种常用的实现方式：for循环、for...of循环、forEach方法以及map方法，重点展示如何在遍历过程中准确访问并获取对象的属性值。

for循环：

const objArray = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' },
];
for (let i = 0; i < objArray.length; i++) {
  const obj = objArray[i];
  console.log(obj.id, obj.name);
}

for...of循环：

const objArray = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' },
];

for (const obj of objArray) {
  console.log(obj.id, obj.name);
}

forEach方法：

const objArray = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' },
];

objArray.forEach((obj) => {
  console.log(obj.id, obj.name);
});

map方法（通常用于创建一个新数组，但也可以用于遍历）：

const objArray = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
  { id: 3, name: 'Charlie' },
];

objArray.map((obj) => {
  console.log(obj.id, obj.name);
  return obj;
});

上述几种方法均能有效实现遍历对象数组并提取属性值的需求，开发者可根据具体场景选择合适的方式。