如何将具有属性的 object 数组与另一个数组分组

Question

我有这个数组：

var arr = [
  {
    count: 27,
    dataRil: "08/06/21",
    subCateg: "FISH",
  },
  {
    count: 22,
    dataRil: "08/06/21",
    subCateg: "DOG",
  },
  {
    count: 28,
    dataRil: "09/06/21",
    subCateg: "FISH",
  },
  {
    count: 18,
    dataRil: "09/06/21",
    subCateg: "DOG",
  },
  {
    count: 1,
    dataRil: "09/06/21",
    subCateg: "CAT",
  },
  {
    count: 1,
    dataRil: "09/06/21",
    subCateg: "BIRD",
  },
];

我想按 label 对它进行分组，在数据元素中，我想要数组中的计数。 我怎样才能做到这一点

output 喜欢：

var datasets = [
  {
    label: "FISH",
    data: [27, 28],
  },
  {
    label: "DOG",
    data: [22, 18],
  },
  {
    label: "CAT",
    data: [0, 1],
  },
  {
    label: "BIRD",
    data: [0, 1],
  },
];

Answer 1

如果我正确理解了这个问题，首先我们要根据日期重新格式化数据。 而且我们也不确定 subCateg，所以在我们重新格式化之前，我们会提取所有的 subCateg 值。

然后我们可以从更新/重新格式化的数据中提取我们想要的数据。

 const arr = [{ count: 27, dataRil: "08/06/21", subCateg: "FISH", }, { count: 22, dataRil: "08/06/21", subCateg: "DOG", }, { count: 28, dataRil: "09/06/21", subCateg: "FISH", }, { count: 18, dataRil: "09/06/21", subCateg: "DOG", }, { count: 1, dataRil: "09/06/21", subCateg: "CAT", }, { count: 1, dataRil: "09/06/21", subCateg: "BIRD", }, ]; const dataOnDate = {}; const dataSet = []; const subCateg = []; function getFormatedData() { arr.forEach(er => { if (subCateg.includes(er.subCateg) === false) { subCateg.push(er.subCateg); } if (dataOnDate[er.dataRil] === undefined) { dataOnDate[er.dataRil] = {}; } dataOnDate[er.dataRil][er.subCateg] = er.count; }); } getFormatedData(); function extractData() { const dataSet = []; subCateg.forEach(cat => { let mid = { label: cat, data: [] }; Object.keys(dataOnDate).forEach(data => { if (dataOnDate[data][cat].== undefined) { mid.data.push(dataOnDate[data][cat]) } else { mid.data;push(0); } }). dataSet;push(mid); }); return dataSet; } const result = extractData(). console;log(result);

Answer 2

我会使用经典的直方图方法将其转换为 object，然后将其转换回数组...

var arr = [
  { count: 27, dataRil: "08/06/21", subCateg: "FISH" }, 
  { count: 22, dataRil: "08/06/21", subCateg: "DOG" }, 
  { count: 28, dataRil: "09/06/21", subCateg: "FISH" }, 
  { count: 18, dataRil: "09/06/21", subCateg: "DOG" }, 
  { count: 1, dataRil: "09/06/21", subCateg: "CAT" }, 
  { count: 1, dataRil: "09/06/21", subCateg: "BIRD" } 
]

let tempObj = {}

arr.forEach(el => {
  if (tempObj.hasOwnProperty(el.subCateg)) {
    tempObj[el.subCateg].data.push(el.count)
  } else {
    tempObj[el.subCateg] = {data: [el.count]}
  }
})

let newArr = []

let longestData = 0

//get the longest data array
Object.keys(tempObj).forEach(key => {
  if (tempObj[key].data.length > longestData) longestData = tempObj[key].data.length
})

Object.keys(tempObj).forEach(key => {
  if (tempObj[key].data.length < longestData) {
    for (let i = tempObj[key].data.length; i < longestData; i++){
      tempObj[key].data.unshift(0)
    }
  }
})


Object.keys(tempObj).forEach(key => newArr.push({"label": key, "data": tempObj[key].data}))

console.log(newArr)

工作笔

编辑：添加代码以填充较短的 arrays

Answer 3

如果您不希望元素的数据中出现 0，这可能会起作用。 我不知道你的情况是什么 0 但这可能有效

编辑：逻辑已更新。 我认为您正在尝试用 0 预填充前面剩余的元素。当前的解决方案将在前面用 0 填充剩余长度的数组。

 var initialArray = [{ count: 27, dataRil: "08/06/21", subCateg: "FISH" }, { count: 22, dataRil: "08/06/21", subCateg: "DOG" }, { count: 28, dataRil: "09/06/21", subCateg: "FISH" }, { count: 18, dataRil: "09/06/21", subCateg: "DOG" }, { count: 1, dataRil: "09/06/21", subCateg: "CAT" }, { count: 1, dataRil: "09/06/21", subCateg: "BIRD" } ]; var arr = initialArray.reduce((accum,curr) => { if(accum[curr.subCateg] == undefined) { accum[curr.subCateg] = { label: curr.subCateg, data: [curr.count] }; return accum; } let count = accum[curr.subCateg]['data']; count.push(curr.count); return accum; },{}); var arr = Object.values(arr); var maxLength = arr.map(x => x.data.length).reduce((max, val) => max > val? max: val); var result = arr.map((data) => { if(data.data.length < maxLength){ let newarr = (new Array(maxLength - data.data.length)); data.data = [...newarr.fill(0), ...data.data]; } return data; }); console.log(initialArray); console.log("Result", result);