How to merge array objects based on 2 keys?

Question

This is my code

var array = [{
    OrderId: "L01",
    Location: "London"
    Qty: "6.00",
    Status: "Product A
  },
  {
    OrderId: "L01",
    Location: "London"
    Qty: "2.00"
    Status: "Product B"
  },
  {
    OrderId: "L01",
    Location: "London"
    Qty: "3.00"
    Status: "Product C"
  },
  {
    OrderId: "P01",
    Location: "Paris"
    Qty: "7.00"
    Status: "Product A"
  },
  {
    OrderId: "P01",
    Location: "Paris"
    Qty: "4.00"
    Status: "Product B"
  },
  {
    OrderId: "P01",
    Location: "Paris"
    Qty: "9.00"
    Status: "Product C"
  }
];

I want to convert this array to

var arrayModified = [{
    OrderId: "L01",
    Location: "London"
    QtyA: "6.00",
    QtyB: "2.00,
    QtyC: "3.00
  },
  {
    OrderId: "P01",
    Location: "London"
    Qty: A "7.00",
    QtyB: "4.00",
    QtyC: "9.00"
  }
];

Basically i want to check variable called status and based on that I have to create new fields QtyA, QtyB, QtyC. OrderId and Plant are common and unique fields.

How can I achieve this functionality in plain JS without Jquery and Lodash.

developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… Just use one of the appropriate functions for arrays. Play around a little bit, and when you got some code to show, edit your questions. — 404_Name_Not_Found
– 404_Name_Not_Found, Commented Feb 12, 2019 at 7:54
Shouldn't the second object in the expected output be "P01" and "Paris"? — holydragon
– holydragon, Commented Feb 12, 2019 at 7:57

adiga · Accepted Answer · 2019-02-12 09:14:47Z

3

You could do this using reduce and Object.values

var array = [{OrderId:"L01",Location:"London",Qty:"6.00",Status:"Product A"},{OrderId:"L01",Location:"London",Qty:"2.00",Status:"Product B"},{OrderId:"L01",Location:"London",Qty:"3.00",Status:"Product C"},{OrderId:"P01",Location:"Paris",Qty:"7.00",Status:"Product A"},{OrderId:"P01",Location:"Paris",Qty:"4.00",Status:"Product B"},{OrderId:"P01",Location:"Paris",Qty:"9.00",Status:"Product C"}];

const merged = array.reduce((r,{OrderId, Location, Status, Qty}) => {
  const [p,suffix] = Status.split("Product ")
  r[OrderId] = r[OrderId] || {OrderId, Location};
  r[OrderId]["Qty"+suffix] =  Qty;
  return r;
},{})

const output = Object.values(merged)

console.log(output)

The goal is to create an accumulator object with each unique OrderId as key. Split the Status at "Product " and use destructuring to take the second item from the resulting array in suffix variable. (Or you can simply use replace: var suffix = Status.replace("Product ", "")). Then use Object.values to get the value of this object to an array.

merged/accumulator looks like this:

{
  "L01": {
    "OrderId": "L01",
    "Location": "London",
    "QtyA": "6.00",
    "QtyB": "2.00",
    "QtyC": "3.00"
  },
  "P01": {
    "OrderId": "P01",
    "Location": "Paris",
    "QtyA": "7.00",
    "QtyB": "4.00",
    "QtyC": "9.00"
  }
}

(Please PLEASE make sure you have a valid input data. There were missing commas and quotes. I wasn't sure if there was issue with my code or the input.)

edited Feb 12, 2019 at 9:14

answered Feb 12, 2019 at 8:08

adiga

35.4k9 gold badges66 silver badges88 bronze badges

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

6 Comments

404_Name_Not_Found Over a year ago

i am still trying to get my head around working with the reduce function. Can you explain the currentValue a bit more please? I mean... did you just hand in the structure and the reduce function knows how to handle it? Also, what is [p,suffix]?? you are declaring a variable with this, but what is this p? Thanks in advance!

404_Name_Not_Found Over a year ago

are you able to declare variables from an array with this??? p = "" and suffix = "<productLetter>"??

adiga Over a year ago

reduce is like a for loop but with an accumulator object or array. Each iteration I'm updating the accumulator based on the Status and OrderId. The second parameter to the reduce is the current item being loope through. I'm using destructuring to split them into variables. Since split returns 2 values, you can use array destructing to get the second item in the array. That's the ` [p,suffix]` syntax

adiga Over a year ago

@JustAMicrobe that's Destructuring. We can actually skip the first declaration since we only care about the alphabet at index = 1. like this: [ , suffix] = Status.split("Product ")

adiga Over a year ago

@JustAMicrobe I recommend going through the MDN link in the comment. It's introduced in ES6 and it's very useful

|

Collectives™ on Stack Overflow

How to merge array objects based on 2 keys?

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related