JS优化：检查数组值存在并赋值的重复代码改进方案

嘿，这个重复代码的问题我太熟了！咱们可以用映射对象结合数组方法来彻底解决冗余，让代码既简洁又好维护～

原代码的问题分析 #

你当前的代码里，重复调用indexOf来判断每个元素是否存在，还要逐个定义变量，不仅写起来麻烦，后续要新增元素映射时，还要重复写几乎一样的逻辑，扩展性很差。

优化方案1：用映射对象+includes（基础版） #

我们可以先把「要检查的元素」和「对应的目标值」做成一个键值对对象，然后用数组方法批量处理：

const myArray = ['a', 'b', 'c', 'd'];
// 定义元素与目标值的映射关系，清晰直观
const valueMap = {
  'a': 'value-for-a',
  'b': 'or-something-for-b',
  'c': 'another-value-for-c'
};

// 生成结果数组：按映射对象的键顺序，判断元素是否存在并返回对应值
const result = Object.keys(valueMap).map(key => 
  myArray.includes(key) ? valueMap[key] : undefined
);

console.log(result); // 输出: ['value-for-a', 'or-something-for-b', 'another-value-for-c']

优化方案2：用Set提升性能（适合大数组） #

如果你的myArray元素很多，每次includes都是O(n)的查找成本，我们可以先把数组转成Set，这样查找变成O(1)，性能会提升很多：

const myArray = ['a', 'b', 'c', 'd'];
const valueMap = {
  'a': 'value-for-a',
  'b': 'or-something-for-b',
  'c': 'another-value-for-c'
};

// 转成Set，优化查找性能
const arraySet = new Set(myArray);
const result = Object.keys(valueMap).map(key => 
  arraySet.has(key) ? valueMap[key] : undefined
);

额外扩展：只返回存在元素的对应值 #

如果不需要保留原位置（比如只返回数组中存在的元素对应的目标值），可以用filter+map组合：

const result = Object.entries(valueMap)
  .filter(([key]) => arraySet.has(key))
  .map(([_, value]) => value);

优化后的好处 #

• 无重复代码：所有判断逻辑只写一次，不用重复定义变量和条件
• 扩展性强：新增元素映射时，只需要在valueMap里加一行键值对就行
• 可读性高：映射关系集中管理，一眼就能看懂每个元素对应什么值
• 性能更优：用Set的版本适合处理大数组，查找效率更高

内容的提问来源于stack exchange，提问作者Maria Lora