pourquoi une carte js sur un tableau modifie-t-elle le tableau d'origine?

Je suis tout à fait confondre par le comportement de la carte().

J'ai un tableau d'objets comme ceci :

const products = [{
    ...,
    'productType' = 'premium',
    ...
}, ...]

et je suis de passage ce tableau à une fonction qui renvoie le même tableau, mais avec tous les produit gratuit :

[{
    ...,
    'productType' = 'free',
    ...
}, ...]

La fonction est :

const freeProduct = function(products){
    return products.map(x => x.productType = "free")
}

Qui retourne le tableau suivant :

["free", "free", ...]

Donc j'ai réécrit ma fonction :

const freeProduct = function(products){
    return products.map(x => {x.productType = "free"; return x})
}

Qui retourne un tableau comme prévu.

MAIS ! Et c'est le moment où j'ai perdu mon esprit, dans les deux cas, l'original de mes produits tableau est modifié.

De la Documentation autour de la carte() dit qu'il ne devrait pas ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map ).

J'ai même essayé de créer un clone de mon tableau de tourner ma fonction comme ceci

const freeProduct = function(products){
    p = products.splice()
    return p.map(x => {x.productType = "free"; return x})
}

Mais j'obtiens toujours le même résultat (ce qui commence à me rendre dingue).

Je serais très reconnaissante à toute personne qui peut m'expliquer ce que je fais mal !

Merci

source d'informationauteur Edwin Joassart

  1. 31

    Vous n'êtes pas la modification de votre tableau d'origine. Vous êtes en modifiant les objets dans le tableau. Si vous voulez éviter la mutation des objets dans votre tableau, vous pouvez utiliser de l'Objet.attribuer pour créer un nouvel objet à l'origine de propriétés de plus tous les changements dont vous avez besoin:

    const freeProduct = function(products) {
  return products.map(x => {
    return Object.assign({}, x, {
      productType: "free"
    });
  });
};
  2. 8

    D'élaborer sur SimpleJ réponse - si vous deviez === les deux tableaux, vous trouverez qu'ils ne seraient pas égales (pas même adresse en mémoire) confirmant que le mappé tableau est en fait un nouveau tableau. Le problème est que vous êtes de retour d'un nouveau tableau, qui est plein de références sur les MÊMES objets dans le tableau d'origine (ce n'est pas le retour de nouveaux objets littéraux, c'est le retour par référence au même objet). Si vous avez besoin pour créer de nouveaux objets qui sont des copies de vieux objets - ie, w/de l'Objet.attribuer exemple donné par SimpleJ.