
本文介绍如何遍历 javascript 对象,精准筛选出值等于目标值的键值对,并将匹配项以对象形式存入新数组,避免常见误操作(如错误地推送整个对象)。
在实际开发中,我们常需根据值反向查找对象中的键。例如,给定一个记录人物胸围尺寸的对象,若想找出所有胸围为 36 的人及其对应尺寸,应返回 [{“Carol”: 36}] —— 而非全部键、全部值,更不能误推整个源对象。
原代码的问题在于:
✅ 条件判断 chestSize[key] === 36 逻辑正确;
❌ 但 chestSizeThirtySix.push(chestSize) 错误地将整个对象反复压入数组(一旦匹配就推一次全量对象),导致结果冗余且语义错误。
推荐使用函数式方法,结合 Object.entries()、Filter() 和 map() 实现清晰、安全、可复用的逻辑:
const chestSize = { "Leanne": 30, "Denise": 26, "Carol": 36, "Jill": 28, "Randy": 32 }; const targetValue = 36; const chestSizeThirtySix = Object.entries(chestSize) .filter(([, value]) => value === targetValue) // 解构忽略 key,只校验 value .map(([key, value]) => ({ [key]: value })); // 重构为单属性对象 console.log(chestSizeThirtySix); // 输出: [{ "Carol": 36 }]
? 关键说明:
- Object.entries(obj) 将对象转为 [key, value] 二维数组,便于链式处理;
- filter() 精确保留满足条件的条目;
- map() 将匹配项格式化为 { key: value } 对象(符合“仅返回匹配键值对”的需求);
- 使用解构参数 ([, value]) 可提升可读性,明确关注点在值上。
⚠️ 注意事项:
- 若需返回纯键名(如 [“Carol”]),将 map() 改为 .map(([key]) => key) 即可;
- 若需支持严格相等(如区分 36 与 “36”),当前 === 已满足;若需宽松匹配,可改用 == 或类型转换逻辑;
- 此方法天然兼容空结果:无匹配时 filter() 返回空数组,后续 map() 不执行,最终得到 [],符合预期。
该方案简洁、声明式、无副作用,是现代 javaScript 处理此类映射查询的推荐实践。