对象属性遍历
JavaScript 中遍历对象属性的多种方法。
for...in 循环
const obj = { a: 1, b: 2, c: 3 };
// 遍历可枚举属性(包括原型链)
for (const key in obj) {
if (obj.hasOwnProperty(key)) {
console.log(key, obj[key]);
}
}
Object.keys()
const obj = { a: 1, b: 2, c: 3 };
// 获取所有可枚举属性键
const keys = Object.keys(obj);
console.log(keys); // ['a', 'b', 'c']
// 遍历
Object.keys(obj).forEach(key => {
console.log(key, obj[key]);
});
Object.values()
const obj = { a: 1, b: 2, c: 3 };
// 获取所有可枚举属性值
const values = Object.values(obj);
console.log(values); // [1, 2, 3]
// 遍历值
Object.values(obj).forEach(value => {
console.log(value);
});
Object.entries()(推荐)
const obj = { a: 1, b: 2, c: 3 };
// 获取键值对数组
const entries = Object.entries(obj);
console.log(entries); // [['a', 1], ['b', 2], ['c', 3]]
// 遍历键值对
Object.entries(obj).forEach(([key, value]) => {
console.log(key, value);
});
// 转换为 Map
const map = new Map(Object.entries(obj));
// 转换对象(键名转换)
const doubled = Object.fromEntries(
Object.entries(obj).map(([key, value]) => [key, value * 2])
);
console.log(doubled); // { a: 2, b: 4, c: 6 }
for...of 循环
const obj = { a: 1, b: 2, c: 3 };
// 遍历键
for (const key of Object.keys(obj)) {
console.log(key);
}
// 遍历值
for (const value of Object.values(obj)) {
console.log(value);
}
// 遍历键值对
for (const [key, value] of Object.entries(obj)) {
console.log(key, value);
}
遍历不可枚举属性
const obj = {};
Object.defineProperty(obj, 'hidden', {
value: 'secret',
enumerable: false
});
// for...in 不会遍历 hidden
// Object.keys 不会返回 hidden
// 使用 Object.getOwnPropertyNames
const allKeys = Object.getOwnPropertyNames(obj);
console.log(allKeys); // ['hidden']
// 获取属性描述符
const descriptor = Object.getOwnPropertyDescriptor(obj, 'hidden');
console.log(descriptor);
// { value: 'secret', enumerable: false, configurable: true, writable: true }