在 JavaScript 中,对象遍历是操作数据的重要技能,尤其在处理动态键值对时。以下是常见遍历方式及使用场景:
1. for...in
循环 📌
const obj = { a: 1, b: 2, c: 3 };
for (const key in obj) {
console.log(key, obj[key]);
}
- 会遍历对象所有可枚举属性(包括继承的)
- 适合遍历对象自身属性,但需注意过滤
__proto__
等特殊属性 - 📸 for_in_Example
2. Object.keys()
/ Object.values()
/ Object.entries()
📦
const keys = Object.keys(obj); // ["a", "b", "c"]
const values = Object.values(obj); // [1, 2, 3]
const entries = Object.entries(obj); // [["a",1], ["b",2], ["c",3]]
- 返回数组形式的键、值或键值对
- 仅遍历对象自身属性,不包含继承属性
- ✅ 推荐用于需要数组操作的场景
- 📸 Object_keys_Usage
3. 使用 Map
或 Set
遍历 🗂️
const map = new Map([[ 'a', 1 ], [ 'b', 2 ]]);
for (const [key, value] of map) {
console.log(key, value);
}
- 适用于键值对结构更复杂的数据
- 支持迭代器接口,可与
for...of
结合使用 - 📸 Map_Iteration
4. 避坑指南 ⚠️
- 🚫 不要直接遍历
__proto__
属性 - 🚫 避免使用
for...in
遍历数组(会遍历索引,但数组是对象) - ✅ 建议配合
hasOwnProperty
进行属性验证 - 📸 Traversal_Caution
拓展阅读 🔍
想深入了解 JavaScript 数据结构操作?点击 Resources/JavaScript_Best_Practices 获取进阶技巧!