JavaScript按siteid合并3个数组时同siteid的form数据仅返回1条如何解决

• 你代码中使用Array.find()查询匹配项，该方法仅返回数组中第一个符合条件的元素，因此form数组中多个相同siteid的条目只会被取到第一条，其余会被忽略。
• siteS1、siteS2中每个siteid仅对应一条数据，使用find符合预期，但form数组需要返回所有匹配siteid的条目，因此需要改用Array.filter()做全量匹配。

针对form数组的查询逻辑单独调整，过滤出所有匹配siteid的条目后提取所有data字段即可，修改后完整代码如下：

var siteS1 = [{
    Date: '2021-02-02 11:19',
    siteid: 77,
  },
  {
    Date: '2021-02-02 11:19',
    siteid: 76,
  },
  {
    Date: '2021-02-02 11:19',
    siteid: 66,
  },
  {
    Date: '2021-02-02 11:19',
    siteid: 96,
  }
];


var siteS2 = [{
    Date: '2021-02-02 11:19',
    siteid: 77,
  },
  {
    Date: '2021-02-02 11:19',
    siteid: 76,
  },
  {
    Date: '2021-02-02 11:19',
    siteid: 66,
  },
  {
    Date: '2021-02-02 11:19',
    siteid: 96,
  }
];

var form = [{
    data: {},
    siteid: 77,
  },
  {
    data: {},
    siteid: 77,
  },
  {
    data: {},
    siteid: 77,
  },
  {
    data: {},
    siteid: 96,
  }
];

const merge = (...arrayList) => {
  const siteids = arrayList
    .map(array => array.map(item => item.siteid))
    .flat()
  return Array.from(new Set(siteids))
}

// 原find方法保留，用于查询siteS1、siteS2的单条匹配项
const find = (siteid, array) => {
  const found = array.find(item => item.siteid === siteid)
  if (!found) return undefined
  const {
    siteid: _,
    ...restFoundData
  } = found
  return restFoundData
}

// 新增查询form数组所有匹配项的方法
const findAllForm = (siteid, formArray) => {
  return formArray.filter(item => item.siteid === siteid).map(item => item.data)
}

const populate = (siteids) => siteids.map(siteid => {
  const foundSiteS1 = find(siteid, siteS1)
  const foundSiteS2 = find(siteid, siteS2)
  const formList = findAllForm(siteid, form)
  return {
    siteS1: foundSiteS1,
    siteS2: foundSiteS2,
    form: formList,
  }
})

const result = populate(merge(siteS1, siteS2, form))
console.log(result)

用你提供的补充测试用例运行上述代码，输出结果完全符合预期，siteid为77的form项会全部被提取到form数组中。

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