JavaScript如何根据两个现有数组匹配生成符合要求的新数组？

问题原因分析 #

你写的代码没有得到预期结果主要有两个核心错误：

• forEach方法没有返回值，你在forEach的回调函数里写的return str只会终止当前这一轮回调的执行，根本不会把值返回给外层的checkStr函数，所以checkStr永远返回undefined
• 你用了map方法处理数组，map是一对一映射方法，会把原数组的每一项都转换为一个新值返回，而你的需求是筛选符合条件的元素，应该用filter方法才对

可行解决方案 #

const animals = ['cat', 'dog', 'cow', 'horse']
const animalsWithNames = ['cat:mik', 'dog', 'horse:lucy']

const result = animals.filter(animal => {
  // 检查第二个数组中是否有任意项以当前animal为前缀
  return animalsWithNames.some(item => item.startsWith(animal))
})

console.log(result) // 输出：['cat', 'dog', 'horse']

优化说明 #

• 用some方法替代forEach：some只要找到第一个符合条件的项就会立刻终止遍历返回true，性能更好，返回的布尔值刚好适配filter的判断逻辑
• 用JS内置的startsWith方法替代手动截取字符串匹配，不用自己处理字符串长度计算的边界问题，代码语义更清晰可读性更高
• 用filter筛选符合条件的元素，完全匹配你需要保留符合条件项的需求，避免map产生多余的undefined项

内容的提问来源于stack exchange，提问作者karo-s