如何使用map、filter或reduce从数组中按ID提取指定元素

嘿，这是个非常典型的数组筛选需求，我来给你拆解几种可行方案，重点说说效率和简洁性兼顾的最优解：

首选方案：filter + Set（性能+简洁双优） #

当需要根据ID列表筛选数组元素时，最推荐的是结合filter方法和Set结构，原因很简单——Set的查找操作是O(1)时间复杂度，比直接用数组includes（O(n)）高效得多，尤其是当目标ID数量较多时，性能差距会很明显。

代码示例：

const cars = [ 
  { id: 23423, brand: 'bmw', doors: 2, color: 'red' }, 
  { id: 23452, brand: 'volvo', doors: 4, color: 'gray' }, 
  { id: 97456, brand: 'citroen', doors: 4, color: 'black' }, 
  { id: 45784, brand: 'dodge', doors: 2, color: 'red' }, 
  { id: 23452, brand: 'ferrari', doors: 2, color: 'red' }, 
  { id: 23522, brand: 'bmw', doors: 2, color: 'blue' } 
];
const targetIds = new Set([45784, 23522]);

// 筛选出ID在目标列表中的元素
const filteredCars = cars.filter(car => targetIds.has(car.id));

这段代码逻辑清晰，语义化极强——filter明确表达了“筛选”的意图，Set.has快速判断当前元素是否符合条件，运行结果就是你要的两个元素：

// filteredCars输出：
[
  { id: 45784, brand: 'dodge', doors: 2, color: 'red' },
  { id: 23522, brand: 'bmw', doors: 2, color: 'blue' }
]

其他可选方案（了解即可，不推荐作为首选） #

用reduce实现筛选 #

reduce也能完成这个需求，但它的语义更偏向“累积计算”，用来做筛选不如filter直观：

const targetIds = new Set([45784, 23522]);
const filteredCars = cars.reduce((result, car) => {
  if (targetIds.has(car.id)) {
    result.push(car);
  }
  return result;
}, []);

功能没问题，但代码冗余度更高，可读性不如filter方案。

不推荐用map做筛选 #

map的核心作用是转换数组元素，不是筛选。硬要用的话需要额外处理空值，属于“用错工具”的情况：

const targetIds = new Set([45784, 23522]);
const filteredCars = cars.map(car => targetIds.has(car.id) ? car : null).filter(Boolean);

多了一次map遍历和空值过滤，效率和简洁性都不如直接用filter。

总结 #

如果只选一个最优方案，**filter + Set**是毫无疑问的首选：既保证了代码的可读性和简洁性，又在大数据量场景下提供了更优的性能。

内容的提问来源于stack exchange，提问作者Louis Lecocq