JavaScript实现两数组匹配并返回匹配值的技术问题

你需要的是拿到两个数组中实际匹配的元素，而不是仅知道是否存在匹配——some()确实只能返回布尔值，不过换用数组的find()方法就能直接解决这个问题，而且完全不需要冗余循环，代码也很简洁。

核心修改思路 #

find()方法会遍历数组，返回第一个满足条件的元素；如果没有找到匹配项，会返回undefined。刚好适配你需要获取实际匹配值的场景，而且它和some()一样，找到匹配项就会停止遍历，效率很高。

修改后的完整代码 #

let switches = document.querySelectorAll('[data-switch]');
let switchesClasses = [].slice.call(switches).map(x => x.dataset.switchClass);
// 用find替代some，直接获取匹配的类名
const found = Array.from(document.querySelector('.test').classList).find(r => switchesClasses.includes(r));
console.log(found); // 这里会输出'list-view'，就是你要的目标值

额外补充：如果需要所有匹配项 #

如果你的场景中可能存在多个匹配类名，也可以用filter()方法获取所有匹配元素的数组：

const allFoundMatches = Array.from(document.querySelector('.test').classList).filter(r => switchesClasses.includes(r));
console.log(allFoundMatches); // 输出所有匹配的类名组成的数组

结合你的HTML结构来看，switchesClasses会从两个开关按钮的data-switch-class属性中得到['grid-view','list-view']，然后从.test元素的class列表中找到第一个出现在这个数组里的元素——也就是list-view，完全符合你的需求。

内容的提问来源于stack exchange，提问作者Martyn Ball