Is there a cleaner way to add a new property with unique values to an array

user_3449597 0
Viewed 82

I'm just learning js now (late to the party I know) and I have the following code and I was wondering if it could be written in a cleaner/simpler way?

Also, ideally, instead of using "if (obj.id === 1)" I would like to iterate through the array and add age based on the sequence i.e. [0] would become '32' and so on.

const students = [ // Three objects, each with four properties
 {
  id: 1,
  name: 'Mark',
  profession: 'Developer',
  skill: 'JavaScript'
 },
 {
  id: 2,
  name: 'Ariel',
  profession: 'Developer',
  skill: 'HTML'
 },
 {
  id: 3,
  name: 'Jason',
  profession: 'Designer',
  skill: 'CSS'
 },
];

const studentsWithAge = students.map(obj => {
if (obj.id === 1) {
 return {...obj, age: '32'};
 } else if (obj.id === 2) {
  return {...obj, age: '26'};
 } else if (obj.id === 3) {
  return {...obj, age: '28'};
 }
 return obj;
});

console.log(studentsWithAge);

// output
// [
//  {
//   id: 1,
//   name: 'Mark',
//   profession: 'Developer',
//   skill: 'JavaScript',
//   age: '32'
//  },
//  {
//   id: 2,
//   name: 'Ariel',
//   profession: 'Developer',
//   skill: 'HTML',
//   age: '26'
//  },
//  {
//   id: 3,
//   name: 'Jason',
//   profession: 'Designer',
//   skill: 'CSS',
//   age: '28'
//  }
// ]
arrays javascript
4 Answers

You can map the array into the object like so:

const ages = ['32', '26', '28'];
const studentsWithAge = students.map(obj => { ...obj, age: ages[obj.id-1] });
user_170554030

You could create an ages array and use the index to map the value to the corresponding object.

const students = [ // Three objects, each with four properties
  {
    id: 1,
    name: 'Mark',
    profession: 'Developer',
    skill: 'JavaScript'
  },
  {
    id: 2,
    name: 'Ariel',
    profession: 'Developer',
    skill: 'HTML'
  },
  {
    id: 3,
    name: 'Jason',
    profession: 'Designer',
    skill: 'CSS'
  },
];

const ages = [32, 26, 28];

const result = students.map((s, i) => {
  return { ...s, age: ages[i] }
});

console.log(result);

user_123789230

Your code is true, another way to add ages by the id is the following code. Just use ids as object key and age as value.

The following code check if id exists in the ages const then add it to the studentsWithAge. It works exactly like your code.

const ages = {1: '32', 2: '26', 3: '28'};

const studentsWithAge = students.map(obj => { 
    if(ages[obj.id]) obj.age = ages[obj.id]; 
    return obj;
});

But if you're sure all ids have age value simpler code like this could be used:

const ages = {1: '32', 2: '26', 3: '28'};
const studentsWithAge = students.map(obj => ({...obj, age: ages[obj.id]}));
user_155640950

The solution depends on how you store the ages data. Here's an example if you keep the ages data in an array of objects, just like you keep the students data.

This approach is easily extended, you can add any other fields related to the student to the object.

students = [
  {id: 1,name: 'Mark',profession: 'Developer',skill: 'JavaScript'},
  {id: 2,name: 'Ariel',profession: 'Developer',skill: 'HTML'},
  {id: 3,name: 'Jason',profession: 'Designer',skill: 'CSS'}];
 
extraInfo = [{id: 1, age:32}, {id:2, age: 26}, {id:3, age: 33}];

const result = students.map((s)=>
  ({ ...s, ...extraInfo.find((a) => a.id === s.id) })
);
  
console.log(result);
.as-console-wrapper{min-height: 100%!important; top: 0}

user_877130
Related