遍历JavaScript对象数组的多种方式-优快云博客

遍历对象数组的方式有多种，以下是其中几种常见的方式：

1. for 循环

使用 for 循环遍历对象数组，可以通过下标访问每个元素。例如：

var objArr = [ { name: 'David', age: 28 }, { name: 'Lucy', age: 30 } ];
for (var i = 0; i < objArr.length; i++) {
    console.log(objArr[i].name, objArr[i].age);
}

2. forEach 方法

使用 forEach 方法遍历对象数组，相比于 for 循环，具有更加简洁的语法和更高的可读性。例如：

var objArr = [ { name: 'David', age: 28 }, { name: 'Lucy', age: 30 } ];
objArr.forEach(function(element) {
    console.log(element.name, element.age);
});

3. for…in 循环

使用 for…in 循环遍历对象数组，适用于需要遍历对象属性的场合。注意，此方法并不能保证遍历顺序。例如：

var objArr = [ { name: 'David', age: 28 }, { name: 'Lucy', age: 30 } ];
for (var i in objArr) {
    console.log(objArr[i].name, objArr[i].age);
}

4. for…of 循环

使用 for…of 循环遍历对象数组，适用于需要遍历对象属性的场合，从 ES6 引入。例如：

var objArr = [ { name: 'David', age: 28 }, { name: 'Lucy', age: 30 } ];
for (var element of objArr) {
    console.log(element.name, element.age);
}

注意，对于一个对象数组，可以使用以上方法遍历其中所有的对象元素。但是，对于某个对象元素本身的属性，还需要使用其他方式进行遍历。

5. Array.map 方法

Array.map 方法可以遍历对象数组中的每个元素，并返回一个新的数组，例如：

var objArr = [ { name: 'David', age: 28 }, { name: 'Lucy', age: 30 } ];
var nameArr = objArr.map(function(element) {
    return element.name;
});
console.log(nameArr); // ['David', 'Lucy']

6. Array.filter 方法

Array.filter 方法可以遍历对象数组中的每个元素，并返回一个新的数组，只包含符合筛选条件的元素，例如：

var objArr = [ { name: 'David', age: 28 }, { name: 'Lucy', age: 30 } ];
var over30Arr = objArr.filter(function(element) {
    return element.age > 30;
});
console.log(over30Arr); // []

7. Array.reduce 方法

Array.reduce 方法可以遍历对象数组中的每个元素，并对它们进行累加计算，返回累加结果，例如：

var objArr = [ { name: 'David', age: 28 }, { name: 'Lucy', age: 30 } ];
var totalAge = objArr.reduce(function(sum, element) {
    return sum + element.age;
}, 0);
console.log(totalAge); // 58

需要注意的是，以上提到的方法都是 ES5 引入的新特性，使用时需要注意浏览器兼容性问题。

8. Object.keys 方法

Object.keys 方法返回一个由对象所有可枚举属性组成的数组，可以遍历对象数组中每个元素的属性，例如：

var objArr = [ { name: 'David', age: 28 }, { name: 'Lucy', age: 30 } ];
for (var i = 0; i < objArr.length; i++) {
    var keys = Object.keys(objArr[i]);
    for (var j = 0; j < keys.length; j++) {
        var key = keys[j];
        console.log(key + ': ' + objArr[i][key]);
    }
}