0

These are the two objects:

const discount = {
  rate: 0.50,
  reason: 'New Year Sales'
}

const products = [
  {
    name: 'TV',
    price: '1200'
  },
  {
    name: 'Bed',
    price: '500'
  },
  {
    name: 'Table',
    price: '50'
  }
]

I want to get them into a new object:

const newProducts = [
  {
    name: 'TV',
    price: '1200',
    rate: 0.50,
    reason: 'New Year Sales',
    finalPrice: 600
  },
  {
    name: 'Bed',
    price: '500',
    rate: 0.50,
    reason: 'New Year Sales',
    finalPrice: 250
  },
  {
    name: 'Table',
    price: '50',
    rate: 0.50,
    reason: 'New Year Sales',
    finalPrice: 25
  }
]

This is a JavaScript exercise and I have tried 'Object.assign' but the new value will overwrite the old ones, resulting in only the newest available. I am not sure whether destructuring using {...products} along with map, forEach will be of use. I can't make this happen

Chai Chong Teh
  • 113
  • 1
  • 7
  • The finalPrice comes from 'rate * price' of the 2 different objects. I have no idea how to perform the calculation and creation of the object. – Chai Chong Teh Jan 21 '19 at 14:13
  • 1
    It sounds like that this is your solution: https://stackoverflow.com/questions/20590177/merge-two-objects-without-override – O. Schnieders Jan 21 '19 at 14:14

3 Answers3

0

So you want to loop through each product in products, and apply discount to each one?

Use .map to create a new array by looping through each item in products and applying a callback function to it:

const newProducts = products.map(oldProduct=>{    
  return {
    name: oldProduct.name,
    price: oldProduct.price,
    rate: discount.rate,
    reason: discount.reason,
    finalPrice: (discount.rate * oldProduct.price)
  }
})

Note: Personally, I prefer it without destructuring, since I think it reads much more clearly. But destructuring certainly works.

RobertAKARobin
  • 3,933
  • 3
  • 24
  • 46
  • Be aware this is going to mutate the original array, you could just do -> `return { rate: discount.rate, reason: discount.reason.....etc` – Keith Jan 21 '19 at 14:17
  • `I prefer it without destructuring` The spread / destructuring is my favourite, but all 3 answers here are good. One advantage to yours, it will work with more browsers without having to use a transpiler. They may even be a speed advantage.. – Keith Jan 21 '19 at 14:48
  • Without destructuring, this is definitely the easiest way to read it~ TQ – Chai Chong Teh Jan 22 '19 at 01:32
0

Using Array#map, destructuring, and spread syntax.

const discount={rate:0.50,reason:'New Year Sales'}
const products=[{name:'TV',price:'1200'},{name:'Bed',price:'500'},{name:'Table',price:'50'}]

const {rate} = discount;
const res = products.map(({price, ...rest})=>{
  return {...rest, ...discount, price, finalPrice: rate*price}
});

console.log(res);
kemicofa ghost
  • 16,349
  • 8
  • 82
  • 131
  • you sure got it right, it'll take me awhile to learn as I am still new so needed some time to digest on the destructuring part. – Chai Chong Teh Jan 22 '19 at 01:31
  • @ChaiChongTeh, yes it takes some time to understand, but once you understand it's easy to read and you can really make some cool working algos. – kemicofa ghost Jan 22 '19 at 01:38
0

You could take an empty object and assign the product, discount and the final price for mapping.

const
    discount = { rate: 0.50, reason: 'New Year Sales' },
    products = [{ name: 'TV', price: '1200' }, { name: 'Bed', price: '500' }, { name: 'Table', price: '50' }],
    newProducts = products.map(product => Object.assign(
        {},
        product,
        discount,
        { finalPrice: product.price * (1 - discount.rate) }
    ));

console.log(newProducts);
.as-console-wrapper { max-height: 100% !important; top: 0; }
Nina Scholz
  • 376,160
  • 25
  • 347
  • 392