How would I reduce this array so the objects in each are merged javascript but dont know key value names

Question

I have an array within an array that I want to reduce the subarrays such that they are one object within. Here is the code generating the array

const final = data.formEntryData.map((item) => {
    //console.log(Object.keys(item.data));
    let key = Object.values(item.data);
    let test = data.hmm.map((array) => {
      //console.log(array.arrayOrder);
      return { [array.name]: key[array.arrayOrder] };
    });
    return test;
  });

Here is the array within array

[
  [
    { 'Product Title Test': 'fdsafa' },
    { 'Product Description': 'ffdsafa' },
    { 'Product Image': 'fdasf' },
    { 'Product Price': undefined },
    { 'Live on Website Test two Three': undefined }
  ],
  [
    { 'Product Title Test': 'Roasted Beans' },
    { 'Product Description': 'For the Squire' },
    { 'Product Image': 'http://image.com' },
    { 'Product Price': undefined },
    { 'Live on Website Test two Three': undefined }
  ],
  [
    { 'Product Title Test': 'Shoes' },
    { 'Product Description': 'Worn' },
    { 'Product Image': 'google.com' },
    { 'Product Price': '100' },
    { 'Live on Website Test two Three': undefined }
  ],
  [
    { 'Product Title Test': 'fdsajkl' },
    { 'Product Description': 'klfdlsk' },
    { 'Product Image': 'flkdsjl' },
    { 'Product Price': 'flskj' },
    { 'Live on Website Test two Three': 'lkjfsdlk' }
  ],
  [
    { 'Product Title Test': 'shoes' },
    { 'Product Description': 'very good' },
    { 'Product Image': 'image.com' },
    { 'Product Price': '20' },
    { 'Live on Website Test two Three': 'yes' }
  ],
  [
    { 'Product Title Test': 'fdsaf' },
    { 'Product Description': 'fdsa' },
    { 'Product Image': 'fdsa' },
    { 'Product Price': 'fdsa' },
    { 'Live on Website Test two Three': 'fdsa' }
  ],
  [
    { 'Product Title Test': 'fdskj' },
    { 'Product Description': '291898868491092489' },
    { 'Product Image': 'fsdk' },
    { 'Product Price': '291898998629859848' },
    { 'Live on Website Test two Three': 'fsd;lk' }
  ],
  [
    { 'Product Title Test': 'fdsfa' },
    { 'Product Description': 'fdsaf' },
    { 'Product Image': 'fdsafa' },
    { 'Product Price': 'fdsaf' },
    { 'Live on Website Test two Three': 'fdasf' }
  ],
  [
    { 'Product Title Test': 'ds' },
    { 'Product Description': 'fdsa' },
    { 'Product Image': 'fdsa' },
    { 'Product Price': 'fdsa' },
    { 'Live on Website Test two Three': 'fdsa' }
  ],
  [
    { 'Product Title Test': 'fdsfds' },
    { 'Product Description': 'fdsfafds' },
    { 'Product Image': 'fdsafs' },
    { 'Product Price': 'fdsaf' },
    { 'Live on Website Test two Three': 'fdsaf' }
  ],
  [
    { 'Product Title Test': 'fdsfds' },
    { 'Product Description': 'fdsfafds' },
    { 'Product Image': 'fdsafs' },
    { 'Product Price': 'fdsaf' },
    { 'Live on Website Test two Three': 'fdsaf' }
  ],
  [
    { 'Product Title Test': 'fdsaf' },
    { 'Product Description': 'fdsafs' },
    { 'Product Image': 'fdasfd' },
    { 'Product Price': 'fdasfdsa' },
    { 'Live on Website Test two Three': 'fdasfd' }
  ]
]

I want to merge the subarrays so one would look like this

[
[...],
[
    { 'Product Title Test': 'fdsaf',
    'Product Description': 'fdsafs',
    'Product Image': 'fdasfd',
    'Product Price': 'fdasfdsa',
    'Live on Website Test two Three': 'fdasfd' }
  ]
,
[...]
]

I have looked at reduce like this

var arr = [{key:"11", value:"1100"},{key:"22", value:"2200"}];
var object = final.reduce(
  (obj, item,) => Object.assign(obj, { [item.key]: item.value }), {});

console.log(object)

However I don't know the item.key and .item.value names because they are derived in the map function.

Any help would be great. Thanks!

Please update your question to use less input data but give us a complete matching output. What is the [...] array in output for instance? To me the input and output as far as the question goes looks the same, so I cannot tell what you are trying to do. — user9706
– user9706, Commented Mar 2, 2021 at 4:10

greenBox · Accepted Answer · 2021-03-02 04:53:05Z

1

Given the array you provided, you can merge the nested arrays into objects using the following function, which uses Object.entries to access the properties for each of the objects.

function mergeInner(outer) {
  return outer.map(inner =>
    inner.reduce((merged, obj) => {
      Object.entries(obj).forEach(([k, v]) => {
        merged[k] = v;
      });
      return merged;
    }, {})
  );
}

Which produces:

[
  {
    'Product Title Test': 'fdsafa',
    'Product Description': 'ffdsafa',
    'Product Image': 'fdasf',
    'Product Price': undefined,
    'Live on Website Test two Three': undefined
  },
  {
    'Product Title Test': 'Roasted Beans',
    'Product Description': 'For the Squire',
    'Product Image': 'http://image.com',
    'Product Price': undefined,
    'Live on Website Test two Three': undefined
  },
  ...
}

edited Mar 2, 2021 at 4:53

answered Mar 2, 2021 at 4:37

greenBox

5524 silver badges5 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How would I reduce this array so the objects in each are merged javascript but dont know key value names

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related