使用 ES6 中的 map 函数更新对象的属性值

Question

I am trying to code this in ES6. Below is what I am trying to achieve. Let's say I have an array of objects called schools .

let schools = [
    {name: 'YorkTown', country: 'Spain'},
    {name: 'Stanford', country: 'USA'},
    {name: 'Gymnasium Achern', country: 'Germany'}
];

Now, I want to write a function called editSchoolName which will take 3 parameters, schools (which is the array I have defined above), oldName and name .

I will pass the name of the school in the parameter oldName and that name should be updated with the value in the parameter name .

I don't want to change the state of the variable schools so I am using a map function which will return a new array with the changes.

The editSchoolName function will be called like this -

var updatedSchools = editSchoolName(schools, "YorkTown", "New Gen");

Here, the name YorkTown should be replaced with the name New Gen . So the expected value of the array updatedSchools should be -

let updatedSchools = [
    {name: 'New Gen', country: 'Spain'},
    {name: 'Stanford', country: 'USA'},
    {name: 'Gymnasium Achern', country: 'Germany'}
];

This is how my editSchoolName function looks like -

const editSchoolName = (schools, oldName, name) =>
    schools.map(item => {
        if (item.name === oldName) {
          /* This is the part where I need the logic */
        } else {
          return item;
        }
    });

Need help in making the change in the editSchoolName function to achieve the above mentioned desired result.

Answer 1

You need to return the updated object:

const editSchoolName = (schools, oldName, name) =>
  schools.map(item => {
      if (item.name === oldName) {
        return {...item, name};
      } else {
        return item;
      }
});

Answer 2

   const editSchoolName = (schools, oldName, newName) =>
    schools.map(({name, ...school }) => ({ ...school, name: oldName === name ? newName : name }));

You could shorten it by using a ternary.

Answer 3

try this, ES6 Object.assign() to create copy of array element and update new object.

 let schools = [{ name: 'YorkTown', country: 'Spain' }, { name: 'Stanford', country: 'USA' }, { name: 'Gymnasium Achern', country: 'Germany' } ]; const editSchoolName = (schools, oldName, name) => { return schools.map(item => { var temp = Object.assign({}, item); if (temp.name === oldName) { temp.name = name; } return temp; }); } var updatedSchools = editSchoolName(schools, "YorkTown", "New Gen"); console.log(updatedSchools); console.log(schools); 

Answer 4

If you want to edit only the commented part:

const editSchoolName = (schools, oldName, name) =>
    schools.map(item => {
        if (item.name === oldName) {
          var newItem = Object.assign({},item);
          newItem.name = name;
          return newItem;
        }
        else{
          return item;
        }
    });

Answer 5

as simple as that:

const editSchoolName = ((schools, oldName, name) =>{
    let results =schools.map((item,index) => { 
        if (item.name === oldName) {
            let newItem = {...item, name} 
            return newItem;
    } else {
        return item;    
    }
    });
    return results;
});

Answer 6

I wonder how come none of the answers give simple solution

const editSchoolName = (schools, oldName, newName) =>
      schools.map(school => { if (school.name === oldName) school.name = newName;
      return school; 
});

Answer 7

 let schools = [{ name: 'YorkTown', country: 'Spain' }, { name: 'Stanford', country: 'USA' }, { name: 'Gymnasium Achern', country: 'Germany' } ]; let updatedSchools = [{ name: 'New Gen', country: 'Spain' }, { name: 'Stanford', country: 'USA' }, { name: 'Gymnasium Achern', country: 'Germany' } ]; const editSchoolName = ((schools, oldName, name) =>{ schools.map(item => { if (item.name === oldName) { item.name = name; return item.name; } else { return item; } }); console.log(schools); }); editSchoolName(schools, 'YorkTown', "New Gen");