使用相同的键从对象创建2维数组

时间:2020-09-11 23:29:03

标签: javascript arrays reactjs

我有一个要转换的对象数组。我的数据集如下:

[
 {
  day: sunday,
  val: 20
 }, 
{
  day: sunday,
  val: 20
 }, 
{
  day: monday,
  val: 10
 },  
{
  day: monday,
  val: 30
 }, 
{
  day: tuesday,
  val: 5
 }, 
{
  day: tuesday,
  val: 5
 }
]

我正在尝试将数据转换为如下形式:

输出: [[20,20], [10,30], [5, 5]]

其中每个嵌套数组均基于对象中的“星期几”。有什么想法吗?

谢谢!

5 个答案:

答案 0 :(得分:1)

您可以按项目day对项目进行分组。分组后,您可以获取地图的值并将项目列表映射到val的列表中。

const data = [
  { day: 'sunday'  , val: 20 }, { day: 'sunday'  , val: 20 },
  { day: 'monday'  , val: 10 }, { day: 'monday'  , val: 30 },
  { day: 'tuesday' , val:  5 }, { day: 'tuesday' , val:  5 }
];

const transformed = Object.values(data.reduce((map, item) =>
  ({ ...map, [item.day] : [ ...(map[item.day] || []), item]
}), {})).map(list => list.map(item => item.val));

console.log(transformed);
.as-console-wrapper { top: 0; max-height: 100% !important; }

或者,您可以立即减小值,但是会丢失所有项目属性。

const data = [
  { day: 'sunday'  , val: 20 }, { day: 'sunday'  , val: 20 },
  { day: 'monday'  , val: 10 }, { day: 'monday'  , val: 30 },
  { day: 'tuesday' , val:  5 }, { day: 'tuesday' , val:  5 }
];

const transformed = Object.values(data.reduce((map, item) =>
  ({ ...map, [item.day] : [ ...(map[item.day] || []), item.val] }), {}));

console.log(transformed);
.as-console-wrapper { top: 0; max-height: 100% !important; }

这是功能版本:

const data = [
  { day: 'sunday'  , val: 20 }, { day: 'sunday'  , val: 20 },
  { day: 'monday'  , val: 10 }, { day: 'monday'  , val: 30 },
  { day: 'tuesday' , val:  5 }, { day: 'tuesday' , val:  5 }
];

const toMatrix = (list, key, valFn) => Object.values(data.reduce((map, item) =>
  ({ ...map, [item[key]] : [ ...(map[item[key]] || []), valFn(item) ] }), {}))

console.log(toMatrix(data, 'day', item => item.val));
.as-console-wrapper { top: 0; max-height: 100% !important; }

答案 1 :(得分:0)

let myarray=[
 {
  day: 'sunday',
  val: 20
 }, 
{
  day: 'sunday',
  val: 20
 }, 
{
  day: 'monday',
  val: 10
 },  
{
  day: 'monday',
  val: 30
 }, 
{
  day: 'tuesday',
  val: 5
 }, 
{
  day: 'tuesday',
  val: 5
 }
];

let newarray=[];

for (let x of myarray) {
    if (!newarray[x.day]) { newarray[x.day]=[]; }
    newarray[x.day].push(x.val);
}

console.log(newarray);

答案 2 :(得分:0)

有关如何实现此目标的信息an example on stackblitz,这里是代码:

<Drawer
  className={classes.drawer}
  open={true}
  classes={{
    paper: classes.drawerPaper
  }}
>
   .
   .
   .
</Drawer>

我在another StackOverflow thread上找到了它,但仍然想用import React, { Component } from "react"; import { render } from "react-dom"; import * as _ from "lodash"; const App = () => { const data = [ { day: "sunday", val: 20 }, { day: "sunday", val: 20 }, { day: "monday", val: 10 }, { day: "monday", val: 30 }, { day: "tuesday", val: 5 }, { day: "tuesday", val: 5 } ]; const groupBy = (arr, prop) => { const map = new Map(Array.from(arr, obj => [obj[prop], []])); arr.forEach(obj => map.get(obj[prop]).push(obj.val)); return Array.from(map.values()); }; React.useEffect(() => { // groupBy from Lodash does not do exaclty what you want (but still very interesting), need to work on it a bit let chunks = Object.values(_.groupBy(data, 'day')).map(x => x.map(item => item.val)); console.log(chunks); // Exactly what you want, but custom made by someone here : // https://stackoverflow.com/a/53704154/9868549 console.log(groupBy(data, 'day')); }, []); return <div>This is a template react</div>; }; render(<App />, document.getElementById("root")); 提供另一种解决方案。

答案 3 :(得分:0)

这可能是一个解决方案:

var obj = [
 {
  day: 'sunday',
  val: 20
 }, 
{
  day: 'sunday',
  val: 20
 }, 
{
  day: 'monday',
  val: 10
 },  
{
  day: 'monday',
  val: 30
 }, 
{
  day: 'tuesday',
  val: 5
 }, 
{
  day: 'tuesday',
  val: 5
 }
]

var obj_output = [];
var bln_array = false;

for (i=0; i < obj.length; i++) {
  var arr = [];
    arr.push(obj[i].val);
  arr.push(obj[i+1].val);
  obj_output.push(arr);
  i = i+1
}

console.log(obj_output);

答案 4 :(得分:0)

这是实现这一目标的一种方法

var old = [
 { day: 'sunday',  val: 20 }, 
 { day: 'sunday',  val: 20 }, 
 { day: 'monday',  val: 10 },  
 { day: 'monday',  val: 30 }, 
 { day: 'tuesday', val:  5 }, 
 { day: 'tuesday', val:  5 }
];

var days = []; 
var result = [];
old.forEach(o => {
  if(days.indexOf(o.day) === -1) {
    days.push(o.day);
    result.push([]);
  }
  result[days.indexOf(o.day)].push(o.val);
});

console.log(result);