如何在不更改原始数组的情况下更改对象Key

Question

I have an array of objects - I want to change one of the object keys to something else without mutating the original array. what is the best method to approach this?

I understand that I could be using the Map method but unsure how this would work. thanks

const books = [
  { title: "To Kill a Mockingbird", writtenBy: "Harper Lee" }, 
  { title: "A Clockwork Orange",  author: "Anthony Burgess" },
  { title: "The Elephant Tree", writtenBy: "R.D. Ronald" } 
]

function changeKey(arr, keyChange, newKey) {

}

// i want to return so the KEY keyChange(author) is changed to newKey(writtenBy)
[
 { title: "To Kill a Mockingbird", writtenBy: "Harper Lee" },
 { title: "A Clockwork Orange",  writtenBy: "Anthony Burgess" },
 { title: "The Elephant Tree", writtenBy: "R.D. Ronald" } 
]

Answer 1

You can map the parameter array and copy each of the objects within it shallowly using the spread operator. For each new object, if it contains the key we'd like to remove, copy the value to the new key and delete the old key.

 const books = [ {title: "To Kill a Mockingbird", writtenBy: "Harper Lee"}, {title: "A Clockwork Orange", author: "Anthony Burgess"}, {title: "The Elephant Tree", writtenBy: "RD Ronald"} ]; const changeKey = (arr, keyChange, newKey) => arr.map(e => { const o = {...e}; if (keyChange in o) { o[newKey] = o[keyChange]; delete o[keyChange]; } return o; }) ; console.log(changeKey(books, "author", "writtenBy")); console.log(books); 

Answer 2

Array helpers like map, filter, reduce, etc doesn't mutate the original array they return a new array. Map receives a function as an argument (callback). Map iterate the array applying your callback in every element.

 const books = [ {title: "To Kill a Mockingbird", writtenBy: "Harper Lee"}, {title: "A Clockwork Orange", author: "Anthony Burgess"}, {title: "The Elephant Tree", writtenBy: "RD Ronald"} ]; //Function to use as a callback on map function changeKey(current) { if(current.author) return { title: current.title, writtenBy: current.author }; return current; } //Creating new array applying changeKey in every element thanks to map const newBooks = books.map(changeKey); console.log(newBooks); 

Answer 3

The following will not mutate books array.

 const books = [ { title: "To Kill a Mockingbird", writtenBy: "Harper Lee" }, { title: "A Clockwork Orange", author: "Anthony Burgess" }, { title: "The Elephant Tree", writtenBy: "RD Ronald" } ]; const renamedBooks = books.map(book => { if (book.author) { return { title: book.title, writtenBy: book.author }; } return book; }); console.info(renamedBooks);