如何比较 2 个数组的相同值并将它们保存到带有真或假标志的第三个数组

Question

我有 2 个数组：

var arr1 = [{name:"Option1"},{"name":"Option2"},{"name":"Option3"},{"name":"Option4"},{"name":"Option5"},{"name":"Option6"},{"name":"Option7"},{"name":"Option8"},{"name":"Option9"},{"name":"Option10"}]

var arr2 = [{"name": "Option 2"},{"name": "Option 4"},{"name": "Option 6"},{"name": "Option 8"},{"name": "Option 10"}]

我希望实现的是第三个数组，其中包含来自 arr1 的所有值以及 "marked":true 的附加标志，如果该值在 arr2 ELSE "marked" 中找到：错误

我尝试了各种 arry 方法的组合，例如 map()、filter()、forEach()，但不知何故无法弄清楚如何在不重复值或重复条目的情况下正确返回。

** 我看到的是，我的内部和外部循环都执行了两个语句，我不知何故错过了返回真/假逻辑，最终重复我的循环的次数等于 arr2 的长度。 **

function test() {
  var arr1 = [{
      name: "Option1"
    },
    {
      "name": "Option2"
    },
    {
      "name": "Option3"
    },
    {
      "name": "Option4"
    },
    {
      "name": "Option5"
    },
    {
      "name": "Option6"
    },
    {
      "name": "Option7"
    },
    {
      "name": "Option8"
    },
    {
      "name": "Option9"
    },
    {
      "name": "Option10"
    }
  ]
  var arr2 = [{
      "name": "Option2"
    },
    {
      "name": "Option4"
    },
    {
      "name": "Option6"
    },
    {
      "name": "Option8"
    },
    {
      "name": "Option10"
    }
  ]
  arr1.forEach((el) => {
    arr2.forEach((el2) => {
      if (el.name.toString() === el2.name.toString()) {
        return console.log("Printing from inside the if loop", el)
      }
      console.log("Printing from outside the if loop", el)
    })
  })
}
test()

Answer 1

首先将 arr2 中的所有比较值（名称）映射到 Set。

然后映射arr1 以创建新数组并在 arr2 Set 中查找每个名称

const arr2Names = new Set(arr2.map(e => e.name));

const res = arr1.map(e => ({...e, marked: arr2Names.has(e.name)}));

console.log(res)

<script>
var arr1=[{name:"Option1"},{name:"Option2"},{name:"Option3"},{name:"Option4"},{name:"Option5"},{name:"Option6"},{name:"Option7"},{name:"Option8"},{name:"Option9"},{name:"Option10"}],
arr2=[{name:"Option2"},{name:"Option4"},{name:"Option6"},{name:"Option8"},{name:"Option10"}];
</script>