How can I add an array item into another array

Question

How do I add a value from one array into another array to create a new array?

I have two arrays and I want to filter through arrayTwo find where id === productID from arrayOne. Then add quantity from arrayOne to arrayTwo so I can get a result such as arrayThree

arrayOne = [
  {
   productID: "DuWTLdYkpwF1DJ2x8SGB",
   quantity: 2
  },
]

arrayTwo = [
{
  id: "DuWTLdYkpwF1DJ2x8SGB",
  minQuantity: 1,
  name: "5 Shade Palette",
  price: "950",
  size: "30g",
  unitPrice: 950,
  },
]

Wanted result::

arrayThree = [
{
  id: "DuWTLdYkpwF1DJ2x8SGB",
  minQuantity: 1,
  name: "5 Shade Palette",
  price: "950",
  size: "30g",
  unitPrice: 950,
  quantity: 2,
  },
]

In other words, essentially, match the productID with the id and if matched, include the quantity prop to the matched element/s. Is that a fair understanding? — jsN00b
– jsN00b, Commented Apr 26, 2022 at 14:19

jsN00b · Accepted Answer · 2022-04-26 14:36:44Z

Below is one possible way to achieve the target.

Code Snippet

// add "quantity" to existing products
const addDeltaToBase = (delta, base) => (
  // iterate over the "base" (ie, existing product array)
  base.map(
    ({ id, ...rest }) => {        // de-structure to access "id"
      // check if "id" is part of the delta (to update "quantity")
      const foundIt = delta.find(({ productID }) => productID === id);
      if (foundIt) {              // found a match, so update "quantity
        return ({
          id, ...rest, quantity: foundIt.quantity
        })
      };
      // control reaches here only when no match. Return existing data as-is
      return { id, ...rest }
    }
  )     // implicit return from "base.map()"
);

const arrayOne = [
  {
   productID: "DuWTLdYkpwF1DJ2x8SGB",
   quantity: 2
  },
];

const arrayTwo = [
{
  id: "DuWTLdYkpwF1DJ2x8SGB",
  minQuantity: 1,
  name: "5 Shade Palette",
  price: "950",
  size: "30g",
  unitPrice: 950,
  },
];

console.log(addDeltaToBase(arrayOne, arrayTwo));

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

Explanation

Inline comments added in the snippet above.

NOTE

This answer will be able to handle both arrayOne & arrayTwo with multiple objects.
It matches the productId with the id and when matched, it merges the quantity into the output (ie, arrayThree).
It aims to be immutable so the input arrays may remain as-is

codemode · Accepted Answer · 2022-04-26 14:25:05Z

1

Time complexity is O(n^2) here. If the given arrays are really long, not the best option. Basically: for each item in arrayOne, find its pair in arrayTwo and merge them.

let arrayThree = arrayOne.map(first => {
    return {
        ...first,
        ...arrayTwo.find(second => second.id == first.productID)
    }
});

answered Apr 26, 2022 at 14:25

codemode

4983 silver badges13 bronze badges

2 Comments

jonson.ncube Over a year ago

This is bringing the the first object as matched but not including the quantity

codemode Over a year ago

...first part gets all keys from the first object. The mapped array will have the merged results.

Wimanicesir · Accepted Answer · 2022-04-27 08:00:13Z

1

You can merge the two objects easily by using the spread operator:

arrayOne = [
  {
   productID: "DuWTLdYkpwF1DJ2x8SGB",
   quantity: 2
  },
]

arrayTwo = [
{
  id: "DuWTLdYkpwF1DJ2x8SGB",
  minQuantity: 1,
  name: "5 Shade Palette",
  price: "950",
  size: "30g",
  unitPrice: 950,
  },
]

console.log({...arrayOne[0], ...arrayTwo[0]})

Use this in combination with your initial filter and you should have what you want. However I would advise to use 'find()' instead.

This will look something like this:

// Loop every item of one array
arrayOne.forEach( (product) => {
  // Find linked product
  let productToMerge = arrayTwo.find(p => p.productID === product.productID)

 // Let's merge them
 let newItem = {...product, ...productToMerge}
})

Now it's just a matter of pushing this newItem in an array to collect all new items.

Spread

Find

edited Apr 27, 2022 at 8:00

answered Apr 26, 2022 at 14:19

Wimanicesir

5,1492 gold badges14 silver badges34 bronze badges

2 Comments

jonson.ncube Over a year ago

This is almost what I need but it only works with one object in an array. How would it work if each array has a few objects in it.

Wimanicesir Over a year ago

I made an edit to show you how I would approach it.

Collectives™ on Stack Overflow

How can I add an array item into another array

3 Answers 3

Comments

2 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related