在一個對象數組中結合兩個不同對象數組的不同屬性

Question

我有一個對象數組和兩個對象

像這樣的對象數組

 [ { 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 }]

現在出現了對象，實際上我通過運行for循環來制作這些對象，如下所示

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))
 });

  }

我想得到這樣的結果

[ { 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 } ]

但我得到這樣的東西

//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 ]

如您所見， Object.assign覆蓋了先前添加的對象，並且object分配的方式不正確，因為您看到它不是以對象方式分配的，所以我該如何實現。

Answer 1

您無需分配，而是將對象推入數組。

如果billPlans是上面包含5個元素的數組， billPlans需要做

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

billPlans.push(object);

我也不知道為什么要過濾數組，但是主要的概念是推入數組，而不是使用Object.assign 。

Object.assign只是將屬性從目標復制到源對象。

Answer 2

進一步解釋先前給出的答案，請嘗試使用功能更強大的方法，該方法不會冒造成數據突變的風險。 .forEach()將運行一個循環，在每個索引處執行給定功能，但不會保留最初傳遞的數據。 而是使用， .map() .filter()或.reduce()取決於在你的最終目標。 .filter()看您的代碼和問題， .map()可以正常工作（盡管您可以輕松地將.filter() / .filter() .reduce()或更多.map()方法鏈接到原始.map() 。. .forEach()不可鏈接。

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)  

使用我描述的方法還刪除了可能創建的所有重復條目。