在一个对象数组中结合两个不同对象数组的不同属性

Question

I have one array of objects and two objects

array of objects something like this

 [ { id: 1, name: 'Monthly Plan', cycle: 1, fees: 1000 },
      { id: 2, name: 'Yearly Plan', cycle: 12, fees: 10000 },
      { id: 3, name: 'Two Months Plan', cycle: 2, fees: 1500 },
      { id: 4, name: 'Three Months Plan', cycle: 3, fees: 2500 },
      { id: 5, name: 'Four Months Plan', cycle: 4, fees: 3000 }]

and now comes the objects actually I am making these objects by running a for loop something like this

if (newPlans) {
       newPlans.forEach(element => {
       let object = {};
       object.id = element.id;
       object.name = element.name,
       object.cycle = element.cycle,
       object.fees = element.fees
       console.log(object);
       console.log(Object.assign(billPlans.filter(bp => bp.id), object))
 });

  }

and I want to get result something like this

[ { id: 1, name: 'Monthly Plan', cycle: 1, fees: 1000 },
  { id: 2, name: 'Yearly Plan', cycle: 12, fees: 10000 },
  { id: 3, name: 'Two Months Plan', cycle: 2, fees: 1500 },
  { id: 4, name: 'Three Months Plan', cycle: 3, fees: 2500 },
  { id: 5, name: 'Four Months Plan', cycle: 4, fees: 3000 },
  { id: 6, name: 'Five Months Plan', cycle: 5, fees: 4000 } 
  { id: 7, name: 'Six Months Plan', cycle: 6, fees: 5000 } ]

but I am getting something like this

//console.log(object)
{ id: 6, name: 'Five Months Plan', cycle: 5, fees: 4000 }

 //console.log(object.assign)
[ { id: 1, name: 'Monthly Plan', cycle: 1, fees: 1000 },
  { id: 2, name: 'Yearly Plan', cycle: 12, fees: 10000 },
  { id: 3, name: 'Two Months Plan', cycle: 2, fees: 1500 },
  { id: 4, name: 'Three Months Plan', cycle: 3, fees: 2500 },
  { id: 5, name: 'Four Months Plan', cycle: 4, fees: 3000 },
  id: 6,
  name: 'Five Months Plan',
  cycle: 5,
  fees: 4000 ]

 //console.log(object)
{ id: 109, name: 'Six Months Plan', cycle: 6, fees: 5000 }

 //console.log(object.assign)
[ { id: 1, name: 'Monthly Plan', cycle: 1, fees: 1000 },
  { id: 2, name: 'Yearly Plan', cycle: 12, fees: 10000 },
  { id: 3, name: 'Two Months Plan', cycle: 2, fees: 1500 },
  { id: 4, name: 'Three Months Plan', cycle: 3, fees: 2500 },
  { id: 5, name: 'Four Months Plan', cycle: 4, fees: 3000 },
  id: 7,
  name: 'Six Months Plan',
  cycle: 6,
  fees: 5000 ]

As you can see the Object.assign is overriding the previously added object and object is assigning not in correct way as you can see it is not assigned in the object way so how can I achieve this .

Answer 1

You need not to assign, but push the object into the array.

If the billPlans is the above array with 5 elements, you need just to do

let object = {};
object.id = element.id;
object.name = element.name,
object.cycle = element.cycle,
object.fees = element.fees

billPlans.push(object);

Also I don't know why you are filtering the array, but the main concept is to push into the array, not use Object.assign .

Object.assign just copies the properties from the destinations into the source object.

Answer 2

Expounding further to the previous answer given, try using a more functional approach that doesn't risk mutating data as a side effect. .forEach() will run a loop, executing a given function at each index, but will NOT preserve data as it was originally passed. Instead use, .map() , .filter() , or .reduce() depending in your end goal. Looking at your code and question as is, .map() works fine (though you can easily chain .filter() / .reduce() or even more .map() methods to the original .map() . .forEach() is not chain-able.

const ObjGenerator = (newPlans) =>  
    !newPlans ? null :
         newPlans
           .map(el => { ...el }
           .map(obj => {
             console.log(obj)
             return obj
           }
           .map(obj => {
            // rather than using the immutable `.push()` method, try 
            // the non-immutable alternative via `.concat()`
            // Also, dynamic invocation of Object.assign provided.

            return Object.assign.apply(billPlans.filter(bp => bp.id), [{}].concat(obj))
           }

ObjGenerator(newPlans)  

Using the approach I describe also removes any duplicate entries that may get created.