How to reshape js array to other form? - Javascript

Max_10
April 21, 2023
297 views
2 votes
4 Answers

I have this array:

 [
        {
            "number": 1,
            "detail": detail1,
            "value": [1, 11, 21, 31]
        },
        {
            "number": 2,
            "detail": detail2,
            "value": [2, 12, 22, 32]
        },
        {
            "number": 3,
            "detail": detail3,
            "value": [3, 13, 23, 33]
        }
    ]

And I need it in this form:

[

    [
     {detail: detail1, value: 1},
     {detail: detail2, value: 2},
     {detail: detail3, value: 3},
    ],
    [
     {detail: detail1, value: 11},
     {detail: detail2, value: 12},
     {detail: detail3, value: 13},
    ],
    [
     {detail: detail1, value: 21},
     {detail: detail2, value: 22},
     {detail: detail3, value: 23},
    ],
    [
     {detail: detail1, value: 31},
     {detail: detail2, value: 32},
     {detail: detail3, value: 33},
    ],
    ...
]

How I could do this? Thanks for help

I tried to do it with loop the way shown below, but couldn’t get those form:

const result = []
for (let i = 0; i < array[0].value.length; i++) {
  for (let j = 1; j < array.length; j++) {
    for (let k = 0; k < array[j].value.length; k++) {
      result.push(values)
    }
  }
}

Hope, I provided enough info

EDIT:
I changed question to improve array readability

Tags: arrays javascript

Answers

const starting_arr = [{
    "number": 1,
    "detail": 4,
    "value": [5, 6, 9]
  },
  {
    "number": 2,
    "detail": 5,
    "value": [7, 8]
  },
  {
    "number": 3,
    "detail": 6,
    "value": [13, 14, 15]
  }
];

function ArrayExpand(arr) {
  const output_arr = [];

  for (let i = 0; i < arr.length; i++) {
    output_arr.push([]);

    const {
      number,
      detail,
      value
    } = arr[i]; // destructuring the object

    for (let j = 0; j < value.length; j++) {
      output_arr[i].push({
        number,
        detail,
        value: value[j]
      })
    }
  }
  
  return output_arr
}

console.log(ArrayExpand(starting_arr))

this should do it.

We initialize an output array where we will be pushing the expanded forms of the individual objects.

At each ‘i’ object, I’m pushing an empty array to the output array. Then at each ‘j’ element in value, I’m pushing the new expanded object to the empty array.

const d = [

    [
        { detail: "detail1", value: "value1" },
        { detail: "detail2", value: "value2" },
        { detail: "detail3", value: "value3" },
    ],
    [
        { detail: "detail1", value: "value11" },
        { detail: "detail2", value: "value12" },
        { detail: "detail3", value: "value13" },
    ],
    [
        { detail: "detail1", value: "value21" },
        { detail: "detail2", value: "value22" },
        { detail: "detail3", value: "value23" },
    ],
    [
        { detail: "detail1", value: "value31" },
        { detail: "detail2", value: "value32" },
        { detail: "detail3", value: "value33" },
    ],
]

const x = [
    {
        "number": 1,
        "detail": "detail1",
        "value": ["value1", "value11", "value21", "value31"]
    },
    {
        "number": 2,
        "detail": "detail2",
        "value": ["value2", "value12", "value22", "value32"]
    },
    {
        "number": 3,
        "detail": "detail3",
        "value": ["value3", "value13", "value23", "value33"]
    }
]

let desired = []

for (let i = 0; i < 4; i++) {
    let a = [];
    for (let j = 0; j < x.length; j++) {
        a.push({
            detail: x[j].detail,
            value: x[j].value[i]
        })
    }
    desired.push(a);
}
console.log('desired: ', desired);

You can use map and foreach with descructuring to transform your data:

const inputArray = [
{
    "number": 1,
    "detail": 1,
    "value": [1, 11, 21, 31]
},
{
    "number": 2,
    "detail": 2,
    "value": [2, 12, 22, 32]
},
{
    "number": 3,
    "detail": 3,
    "value": [3, 13, 23, 33]
}
];

const result = inputArray[0].value.map((_, idx) => {
    const values = [];
    inputArray.forEach(({ detail, value }) => {
        values.push({ detail, value: value[idx] });
    });
    return values;
});
console.log(result);

Does the following help? Please see comments for a little info on what this is doing.

const items = [
  {
    "number": 1,
    "detail": 1,
    "value": [1, 11, 21, 31]
  },
  {
    "number": 2,
    "detail": 2,
    "value": [2, 12, 22, 32]
  },
  {
    "number": 3,
    "detail": 3,
    "value": [3, 13, 23, 33]
  },
  
  // added to show what might happen if there are gaps
  {
    "number": 5,
    "detail": 5,
    "value": [5, 15, 25]
  }
];

// work out the max length of the value arrays
const new_length = Math.max(...items.map((v) => v.value.length));

// create a new array of length new_length and prepopulate with fresh arrays
const result = Array.from({ length: new_length }, () => []);

// for each item create a new entry in the correct result sub array for each
// of the values in the item value array
for(const item of items) {
  for(const index in result) {
    const value = item.value[index];
    
    if(value)
      result[index][item.number - 1] = { detail: item.detail, value };
  }
}

console.log(result);

Please signup or login to give your own answer.

Click here to cancel reply.

How to reshape js array to other form? – Javascript

Answers