
本文介绍如何遍历 javascript 对象,精准筛选出值等于目标值的键名(或键值对),并将其收集为新数组,避免常见错误如误推整个对象或返回全部键。
在实际开发中,我们常需根据值反查对象中的匹配键。例如,给定一个记录人物胸围尺寸的对象,想找出所有胸围为 36 的人名(即键名)。但初学者容易犯一个典型错误:在循环中误将整个对象 chestSize(而非键名 key)推入数组,导致结果完全偏离预期。
来看原始代码的问题所在:
const chestSize = {
"Leanne": 30,
"Denise": 26,
"Carol": 36,
"Jill": 28,
"Randy": 32
};
const chestSizeThirtySix = [];
for (const key in chestSize) {
if (chestSize[key] === 36) {
chestSizeThirtySix.push(chestSize); // ❌ 错误:推入整个对象
}
}
console.log(chestSizeThirtySix); // 输出:[{ Leanne: 30, Denise: 26, ... }] —— 不是想要的键或键值对正确做法是:只推送匹配的键名(key),或按需推送包含该键值对的新对象。推荐使用函数式方法 Object.entries() 配合 filter() 和 map(),语义清晰、不可变且易于复用:
const chestSize = {
"Leanne": 30,
"Denise": 26,
"Carol": 36,
"Jill": 28,
"Randy": 32
};
// ✅ 方案一:仅获取匹配的键名(字符串数组)
const keysWithValue36 = Object.entries(chestSize)
.filter(([, value]) => value === 36)
.map(([key]) => key);
console.log(keysWithValue36); // ["Carol"]
// ✅ 方案二:获取匹配的键值对对象数组(每个元素为 { key: value })
const entriesWithValue36 = Object.entries(chestSize)
.filter(([, value]) => value === 36)
.map(([key, value]) => ({ [key]: value }));
console.log(entriesWithValue36); // [{ Carol: 36 }]⚠️ 注意事项:
- for...in 循环需配合 hasOwnProperty() 防御原型链污染(虽本例无此风险,但属最佳实践);
- 若需兼容旧环境(如 IE),Object.entries() 需 polyfill,或改用 Object.keys() + map() 组合;
- 多个键可能对应同一值(如两人胸围均为 36),上述方案天然支持多匹配结果;
- 使用严格相等 === 可避免类型隐式转换导致的意外匹配(如 36 == "36" 为 true,但通常不期望如此)。
总结:与其手动遍历+条件推送,不如利用 Object.entries() 将对象转为 [key, value] 二元组数组,再通过函数式链式操作精准筛选与映射——代码更简洁、意图更明确、维护性更高。










