本文介绍两种 ES6 风格的高效方法：使用 map() 直接映射索引到元素，或用 filter() 结合 includes() 按索引条件过滤原数组，适用于 React 等场景中提取指定位置的 weekday 等数据。
本文介绍两种 es6 风格的高效方法：使用 map() 直接映射索引到元素，或用 filter() 结合 includes() 按索引条件过滤原数组，适用于 react 等场景中提取指定位置的 weekday 等数据。
在实际开发（尤其是 React 组件间传递结构化数据）中，常需根据一组索引值从原始字符串数组中提取对应元素。例如，给定一周七天的数组 ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"] 和用户选择的索引数组 [0, 2, 4]，目标是生成 ["Mon", "Wed", "Fri"] 并传递给子组件。
推荐首选 map() 方式：语义清晰、性能更优（时间复杂度 O(n)，n 为选中索引数），且天然规避越界风险（若索引超出原数组长度，结果为 undefined，可配合空值检查增强健壮性）：
const weekDays = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"];
const selectedIndices = [0, 2, 4];
const selectedWeekdays = selectedIndices
.map(index => {
if (index >= 0 && index < weekDays.length) {
return weekDays[index];
}
console.warn(`Index ${index} is out of bounds for weekDays array`);
return null;
})
.filter(item => item !== null); // 移除无效项
console.log(selectedWeekdays); // ["Mon", "Wed", "Fri"]另一种方式是 filter() + includes()：逻辑直观（“保留索引在目标列表中的元素”），但性能略低（对原数组每个元素都调用 includes()，最坏 O(m×n)，m 为原数组长度），适合索引集较小且可读性优先的场景：
const selectedWeekdays = weekDays.filter((_, index) => selectedIndices.includes(index) );
⚠️ 注意事项：
立即学习“Java免费学习笔记（深入）”；
- 若
selectedIndices包含重复或负数/超界索引，map()方式需手动校验；filter()方式则自动忽略不存在的索引（因includes()返回false）。 - 在 React 中，建议将该逻辑封装为纯函数（如
getSelectedDays(weekDays, indices)），便于测试与复用，并确保每次渲染生成新数组（避免引用污染）。 - 如索引数组较大（如数百项），可先将其转为
Set提升includes()效率：const indexSet = new Set(selectedIndices); ... indexSet.has(index)。
两种方法均符合 ES6 规范，无外部依赖，可根据数据规模与团队偏好灵活选用。
