一、使用 for-in 循环------简单直接,快速上手
for-in
循环是最基础也是最常用的对象遍历方法。它语法简单,适合初学者快速掌握
js
const user = {
name: 'Alice',
age: 25,
job: 'Engineer'
};
for (const key in user) {
const value = user[key];
console.log(`${key}: ${value}`);
}
创建了一个用户对象 user
,通过 for-in 循环遍历每一个属性
,并打印出键和值
。输出结果如下:
name: Alice
age: 25
job: Engineer
这种方法非常直观,但需要注意的是,它会遍历对象的所有可枚举属性
,包括原型链上的属性
二、使用 Object.entries 和 forEach------优雅简洁,提升代码可读性
Object.entries
方法可以将对象转换成一个包含键值对的二维数组
,结合 forEach 方法,可以更加优雅地遍历对象。
js
const product = {
id: 101,
name: 'Laptop',
price: 799
};
Object.entries(product).forEach(([key, value]) => {
console.log(`${key}: ${value}`);
});
Object.entries(product)
返回[['id', 101], ['name', 'Laptop'], ['price', 799]]
这样的二维数组,接着我们使用 forEach 遍历数组中的每一个键值对,输出结果如下
id: 101
name: Laptop
price: 799
三、使用 for-of 循环------语法简洁,增强可读性
for-of
循环结合 Object.entries
,可以使遍历对象的代码更加简洁明了。
js
const order = {
orderId: 'A123',
productName: 'Phone',
quantity: 2
};
for (const [key, value] of Object.entries(order)) {
console.log(`${key}: ${value}`);
}
同样,Object.entries(order)
返回一个包含键值对的二维数组
,for-of 循环则可以直接遍历这个数组中的每一个元素
,输出结果如下:
orderId: A123
productName: Phone
quantity: 2