0
votes

ES6 fusionne deux objets en utilisant la répartition ne fonctionne pas

Je souhaite fusionner deux objets javascript à l'aide d'opérateurs de diffusion, mais je suis incapable de produire le résultat escompté. Voici ma première liste d'objets (objets enveloppés dans un objet)

{
  "20080": {
    "Qty": 2
  },
  "20110": {
    "Qty": 3
  }
}

La deuxième liste d'objets est

const result = {...arr2,...arr3}

Je veux fusionner ces 2 objets en utilisant es6.

var arr3 = {
  "20080": {
    "Qty": 2,


  },
  "20110": {
    "Qty": 3,
  } }

Qté attendue pour être ajoutée aux objets, mais je ne vois que Qté. Résultat que j'obtiens

var arr2 = {
  "20080": {
    "ProductQuantitesId": 20080,    
    "CustomerPrice": 100,
    "DisplayQuantity": "20 L",   
    "DisplayProductName": "Bisleri Mineral Water",
    "DiscountedPrice": 20,
    "DiscountedPercentage": 17
  },
  "20110": {
    "ProductQuantitesId": 20110,   
    "CustomerPrice": 270,
    "DisplayQuantity": "5 kgs",    
    "DisplayProductName": "Srujana Curd Bucket",
    "DiscountedPrice": 30,
    "DiscountedPercentage": 10
  } }

Quelqu'un peut-il m'aider?

javascript ecmascript-6

0 commentaires

5 Réponses :

1
votes

arr3 écrase les valeurs de arr2 car les deux objets partagent les mêmes clés. En supposant que les clés de arr2 et arr3 sont identiques, vous pouvez utiliser la solution suivante:

var arr2 = {
  "20080": {
    "ProductQuantitesId": 20080,    
    "CustomerPrice": 100,
    "DisplayQuantity": "20 L",   
    "DisplayProductName": "Bisleri Mineral Water",
    "DiscountedPrice": 20,
    "DiscountedPercentage": 17
  },
  "20110": {
    "ProductQuantitesId": 20110,   
    "CustomerPrice": 270,
    "DisplayQuantity": "5 kgs",    
    "DisplayProductName": "Srujana Curd Bucket",
    "DiscountedPrice": 30,
    "DiscountedPercentage": 10
  } 
}

var arr3 = {
  "20080": {
    "Qty": 2,
  },
  "20110": {
    "Qty": 3,
  } 
}

// First, get the keys from arr2 using Object.keys().
// Then, use Array.prototype.reduce() to iterate through the keys.
// In the callback, acc is referring to the empty object, {}, 
// passed as the second argument in reduce().
const result = Object.keys(arr2).reduce((acc, key) => {

    // Set the value of the resulting object's key equal to the 
    // combined key-values of arr2 and arr3
    acc[key] = { ...arr2[key], ...arr3[key] }
    
    // Make sure to return the object
    return acc
}, {})

console.log(result)

0 commentaires

1
votes

La répartition des propriétés dans les initialiseurs d'objets copie les propriétés énumérables propres d'un objet fourni sur l'objet nouvellement créé.

Donc, ce code fonctionnera:

var arr2 = {
  "20080": {
    "ProductQuantitesId": 20080,    
    "CustomerPrice": 100,
    "DisplayQuantity": "20 L",   
    "DisplayProductName": "Bisleri Mineral Water",
    "DiscountedPrice": 20,
    "DiscountedPercentage": 17
  },
  "20110": {
    "ProductQuantitesId": 20110,   
    "CustomerPrice": 270,
    "DisplayQuantity": "5 kgs",    
    "DisplayProductName": "Srujana Curd Bucket",
    "DiscountedPrice": 30,
    "DiscountedPercentage": 10
  } }
  
  var arr3 = {
  "20080": {
    "Qty": 2,


  },
  "20110": {
    "Qty": 3,
  } }
  
  for (let property in arr2) {
    if (arr2.hasOwnProperty(property)) {
       arr2[property] = {...arr2[property], ...arr3[property]};
    }
  }
  
  console.log(arr2)

0 commentaires

1
votes

Lorsque vous avez les mêmes clés, elles seront toujours écrasées par la dernière

var arr2 = {"20080": {"ProductQuantitesId": 20080,"CustomerPrice": 100,"DisplayQuantity": "20 L","DisplayProductName": "Bisleri Mineral Water","DiscountedPrice": 20,"DiscountedPercentage": 17},"20110": {"ProductQuantitesId": 20110,"CustomerPrice": 270,"DisplayQuantity": "5 kgs","DisplayProductName": "Srujana Curd Bucket","DiscountedPrice": 30,"DiscountedPercentage": 10}}

var arr3 = {"20080": {"Qty": 2,},"20110": {"Qty": 3,}}

let newObj = {}
for (let property in arr2) {
  if (property in arr3) {
    newObj[property] = { ...arr2[property],
      ...arr3[property]
    };
  }
}

console.log(newObj)

Pour réaliser ce que vous essayez, vous pouvez parcourir les clés de l'un d'entre eux et fusionner avec la valeur de l'autre

let first = { a: 'first' }
let second = { a : 'second' }

let firstAtEnd = {...second, ...first}

console.log(firstAtEnd)

let secondAtEnd = {...first, ...second}

console.log(secondAtEnd)

1 commentaires

Merci pour toutes vos réponses. cela a beaucoup aidé à comprendre le problème.

1
votes

Avec la façon dont vous avez utilisé l'opérateur de propagation, il constate que le deuxième objet a la même clé que le premier, il remplace donc la propriété du premier par la propriété du deuxième objet.

Je pense ce que vous devez faire dans ce cas, il faut parcourir les clés du premier objet et fusionner une clé à la fois avec un nouvel objet. comme ci-dessous.

var arr2 = {
  "20080": {
    "ProductQuantitesId": 20080,    
    "CustomerPrice": 100,
    "DisplayQuantity": "20 L",   
    "DisplayProductName": "Bisleri Mineral Water",
    "DiscountedPrice": 20,
    "DiscountedPercentage": 17
  },
  "20110": {
    "ProductQuantitesId": 20110,   
    "CustomerPrice": 270,
    "DisplayQuantity": "5 kgs",    
    "DisplayProductName": "Srujana Curd Bucket",
    "DiscountedPrice": 30,
    "DiscountedPercentage": 10
  } }

var arr3 = {
  "20080": {
    "Qty": 2,


  },
  "20110": {
    "Qty": 3,
  } }


const result = {}
for (let key of Object.keys(arr2)) {
	result[key] = { ...arr2[key], ...arr3[key] }
}

console.log(result)

0 commentaires

0
votes

Vous pouvez utiliser Object.entries et map pour obtenir ces données

var arr2 = {"20080": {"ProductQuantitesId": 20080,"CustomerPrice": 100,"DisplayQuantity": "20 L","DisplayProductName": "Bisleri Mineral Water","DiscountedPrice": 20,"DiscountedPercentage": 17},"20110": {"ProductQuantitesId": 20110,"CustomerPrice": 270,"DisplayQuantity": "5 kgs","DisplayProductName": "Srujana Curd Bucket","DiscountedPrice": 30,"DiscountedPercentage": 10}}

var arr3 = {"20080": {"Qty": 2,},"20110": {"Qty": 3,}}

var res = Object.entries(arr2)
                .map(([k, v]) => ({ [k]: {...v, ...(arr3[k] || {})} }))
                .reduce((a, b) => ({...a, ...b}))

console.log(res)

0 commentaires