如何遍历JavaScript Set并找到目标元素时终止循环？

问题根源 #

• forEach里的return false只能结束当前这一轮的回调函数，没法停下整个遍历，所以循环会一直跑。
• 报错urlSet1.every is not a function，说明你的urlSet1是原生Set对象，不是数组——数组有every方法，但原生Set没有这个方法。
• break不能在forEach的回调里用，因为回调是独立的函数作用域，break只对for/for...of这类原生循环语句生效。

几种可行的实现方法 #

方法1：用for...of循环（最直接，原生Set支持） #

这种方式能在找到目标元素后立刻终止循环，逻辑清晰：

let newUrl;
for (const value of urlSet1) {
  if (!urlSet2.has(value)) {
    newUrl = value;
    break; // 找到符合条件的元素后直接停掉整个循环
  }
}

方法2：把Set转成数组后用find方法 #

如果更习惯数组操作，可以先把Set转成数组，find方法会在找到第一个匹配项后自动停止遍历：

const urlArray1 = Array.from(urlSet1); // 也可以用 [...urlSet1] 转成数组
const newUrl = urlArray1.find(value => !urlSet2.has(value));

要是urlSet1里的所有元素都在urlSet2里存在，newUrl会是undefined，你可以根据业务需求处理这种情况。

方法3：转数组后用some方法 #

some方法会在回调返回true时立刻停止遍历，也能达成需求：

let newUrl;
const urlArray1 = Array.from(urlSet1);
urlArray1.some(value => {
  if (!urlSet2.has(value)) {
    newUrl = value;
    return true; // 返回true触发遍历终止
  }
  return false;
});

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