JavaScript 遍历数组，删除每个值的重复项，然后使用该值和另一个值推送到新数组

Question

我有一个对象数组通过 api 调用进入我的 Vuejs 前端，我试图遍历、删除重复项，然后返回一个具有唯一“阶段”及其关联的“id”的新数组。原始数组有几个我不需要的其他键/值。我还按阶段编号对它们进行排序。这是我的代码:

salesPhases () {
  let phases = this.$store.state.addresses.salesPhases
  let uniquePhases = []
  for (let i = 0; i < phases.length; i++) {
    if (uniquePhases.indexOf(phases[i].phase_number) === -1) {
      uniquePhases.push(phases[i].phase_number)
    }
  }
  return uniquePhases.sort((a, b) => {
    return a - b
  })
}

上面的代码适用于我需要的一切，不包括 id。这是我这样做的尝试，然后否定了独特的阶段条件。

uniquePhases.push([phases[i].phase_number, phases[i].id])

排序仍然有效，但它正在对一个大的一维数组进行排序。阶段数组看起来像这样:

{ "data": [
    {
        "id": "94e224af-135f-af31-3619-535acfae9930",
        "street_address1": "407 48TH ST E",
        "street_address2": null,
        "phase": "101",
        "sales_rep": "164",
        "id": "abd90d6b-28a8-2be6-d6c1-abd9007aef38",
        "name": "48TH ST E",
        "block_minimum": 400,
        "block_maximum": 498,
        "side": 2
    },
    {
        "id": "94e224af-135f-af31-3619-535acfae9930",
        "street_address1": "407 48TH ST E",
        "street_address2": null,
        "phase": "101",
        "sales_rep": "164",
        "id": "abd90d6b-28a8-2be6-d6c1-abd9007aef38",
        "name": "48TH ST E",
        "block_minimum": 401,
        "block_maximum": 499,
        "side": 1
    }
]

Answer 1

您可以 filter使用 Set 获得唯一的数组, 然后 map将项目转换为仅包含 id 和 phase_number 的新对象，然后是 sort通过 phase_number:

salesPhases () {
  const uSet = new Set()
  return this.$store.state.addresses.salesPhases
    .filter(({ phase_number }) => uSet.has(phase_number) ? false : uSet.add(phase_number)) // get uniques by phase_number
    .map(({ id, phase_number }) => ({ id, phase_number })) // get an object with the id and the phase_number
    .sort((a, b) => a.phase_number - b.phase_number) // sort by phase_number
}

您还可以使用 reduce和 Map , 然后传播 Map.values()数组的迭代器

salesPhases () {
  return [...this.$store.state.addresses.salesPhases
    .reduce((m, { id, phase_number }) => 
      m.has(phase_number) ? m : m.set(phase_number, { id, phase_number }), new Map()) // set to map, if phase_number key doesn't exist
    .values()] // convert the Map values to an array
    .sort((a, b) => a.phase_number - b.phase_number) // sort by phase_number
}