JS 遍历对象属性

在 JavaScript 中,对象是一种复杂的数据类型,它可以存储多个键值对。在某些情况下,我们需要遍历对象的属性,并获取它们的键和值。本文将介绍如何使用不同的方法和技巧来遍历对象属性。
1. for…in 循环
for...in 循环是一种常见的遍历对象属性的方法。它会遍历对象的可枚举属性,包括继承的属性。下面是一个简单的示例:
let person = {
name: 'Alice',
age: 30,
gender: 'female'
};
// 遍历对象的属性
for (let key in person) {
console.log(key + ': ' + person[key]);
}
运行结果:
name: Alice
age: 30
gender: female
在上面的示例中,我们使用 for...in 循环遍历了 person 对象的属性,并输出每个属性的键和值。
需要注意的是,for...in 循环会遍历对象的原型链上的属性,因此可能会遍历到不是对象自身定义的属性。在实际使用中,我们可以通过 hasOwnProperty 方法来过滤出对象自身定义的属性。
let person = {
name: 'Alice',
age: 30,
gender: 'female'
};
// 遍历对象的自身属性
for (let key in person) {
if (person.hasOwnProperty(key)) {
console.log(key + ': ' + person[key]);
}
}
2. Object.keys 方法
Object.keys 方法可以获取对象自身可枚举属性的键,返回一个包含所有键的数组。我们可以使用 Object.keys 方法结合 forEach 方法来遍历对象的属性。下面是一个示例:
let person = {
name: 'Alice',
age: 30,
gender: 'female'
};
// 获取对象的属性键数组
let keys = Object.keys(person);
// 遍历属性键数组
keys.forEach(function(key) {
console.log(key + ': ' + person[key]);
});
运行结果:
name: Alice
age: 30
gender: female
在上面的示例中,我们首先使用 Object.keys 方法获取了 person 对象的属性键数组,然后使用 forEach 方法遍历了这个数组,并输出每个属性的键和值。
需要注意的是,Object.keys 方法只会返回对象自身的可枚举属性,不会包括继承的属性。
3. Object.getOwnPropertyNames 方法
Object.getOwnPropertyNames 方法可以获取对象自身所有属性的键,包括不可枚举属性。与 Object.keys 方法不同,Object.getOwnPropertyNames 方法返回一个包含所有属性键的数组。下面是一个示例:
let person = {
name: 'Alice',
age: 30,
gender: 'female'
};
// 获取对象的所有属性键数组
let keys = Object.getOwnPropertyNames(person);
// 遍历属性键数组
keys.forEach(function(key) {
console.log(key + ': ' + person[key]);
});
运行结果:
name: Alice
age: 30
gender: female
在上面的示例中,我们使用 Object.getOwnPropertyNames 方法获取了 person 对象的所有属性键数组,并使用 forEach 方法遍历了这个数组,并输出每个属性的键和值。
需要注意的是,Object.getOwnPropertyNames 方法返回的属性键数组中包括不可枚举属性。
4. Object.entries 方法
Object.entries 方法可以获取对象自身可枚举属性的键值对,返回一个包含所有键值对的二维数组。我们可以使用 Object.entries 方法结合 forEach 方法来遍历对象的属性。下面是一个示例:
let person = {
name: 'Alice',
age: 30,
gender: 'female'
};
// 获取对象的属性键值对数组
let entries = Object.entries(person);
// 遍历属性键值对数组
entries.forEach(function([key, value]) {
console.log(key + ': ' + value);
});
运行结果:
name: Alice
age: 30
gender: female
在上面的示例中,我们首先使用 Object.entries 方法获取了 person 对象的属性键值对数组,然后使用 forEach 方法遍历了这个数组,并输出每个属性的键和值。
需要注意的是,Object.entries 方法返回的属性键值对数组中包括对象自身的可枚举属性。
结语
本文介绍了 JavaScript 中遍历对象属性的几种常见方法,包括 for...in 循环、Object.keys 方法、Object.getOwnPropertyNames 方法和 Object.entries 方法。每种方法都有其特点和适用的场景,我们可以根据具体需求选择合适的方法来遍历对象的属性。
极客笔记