1
votes

Carte de tableau JavaScript tout en conservant les éléments d'origine dans le tableau

J'ai ce tableau.

const data = [
  { name: "A", age: "12"},
  { name: "B", age: "5"},
  { name: "C", age: "6"}
];

console.log(
  "MAP",
  data.map(element => (element.key = element.name + element.age))
);

Je souhaite ajouter une propriété supplémentaire appelée key à ce tableau comme ceci.

const data = [
  { name: "A", age: "12", key: "A12" },
  { name: "B", age: "5", key: "B5" },
  { name: "C", age: "6", key: "C6" }
];

javascript object arrays ecmascript-6

0 commentaires

3 Réponses :

4
votes

Vous devez renvoyer un objet à partir du rappel map :

const data = [
  { name: "A", age: "12"},
  { name: "B", age: "5"},
  { name: "C", age: "6"}
];

data.forEach((obj) => {
  obj.key = obj.name + obj.age;
});
console.log(data);

Si vous souhaitez faire muter les objets existants, utilisez forEach au lieu de .map:

const data = [
  { name: "A", age: "12"},
  { name: "B", age: "5"},
  { name: "C", age: "6"}
];

console.log(
  data.map(({ name, age }) => ({ name, age, key: name + age }))
);

0 commentaires

3
votes

Renvoyez également l'élément en utilisant l'opérateur virgule:

.as-console-wrapper { max-height: 100% !important; top: auto; }

const data = [
  { name: "A", age: "12"},
  { name: "B", age: "5"},
  { name: "C", age: "6"}
];

console.log(data.map(({ name, age }) => ({ name, age, key: name + age})));

Ou modifiez simplement votre rappel map pour le rendre plus simple avec la déstructuration:

.as-console-wrapper { max-height: 100% !important; top: auto; }

const data = [
  { name: "A", age: "12"},
  { name: "B", age: "5"},
  { name: "C", age: "6"}
];

console.log(data.map(element => (element.key = element.name + element.age, element)));

0 commentaires

1
votes

Il y a plus d'une façon de faire cela et le Array.map est de loin le moyen le plus concis et le plus propre de le faire comme déjà fourni. Voici quelques autres méthodes:

const data = [
  { name: "A", age: "12", city: 'Miami' },  // "key": "A12Miami"
  { name: "B", age: "2", gender: 'M'},      // "key": "B2M"
];

let all = data.map(obj => 
  ({...obj, ...Object.fromEntries([['key', Object.values(obj).join('')]])}))

console.log(all)

Si vous souhaitez générer une clé à partir de toutes les valeurs (en supposant que toutes sont des primitives), vous pouvez également le faire:

 const data = [ { name: "A", age: "12" }, { name: "B", age: "5" }, { name: "C", age: "6" } ];

let from = Array.from(data, ({name, age}) => ({name, age, key: name+age}))
let assign = data.map(({name, age}) => Object.assign({name, age}, {key: name+age}))

console.log('from: ', from)
console.log('assign: ', assign)

De cette façon, vous n'avez pas à spécifier ou à vous soucier des noms pop, etc.

0 commentaires