issue with spread operator in javascript

Question

I want to rewrite an array and to get a new one at the final. This is my code:

 const arr = [ { type:"Fiat", model:"500", color:"white" }, { type:"ford", model:"5300", color:"gray" } ]; const newArr = arr.map(i => { const r = { ...arr, power:2 } return r }) console.log(newArr)

Now i get the wrong result, because one every iteration, the new array grow with a copy of the first array:

 const r = {
    ...arr,
    power:2
 }

How to get the next result?

{
  type:"Fiat", model:"500", color:"white", power: 2
},
{
  type:"ford", model:"5300", color:"gray", power: 2
}

Answer 1

You are spreading arr .You need to spread i which is the object inside the array.

 const arr = [ { type:"Fiat", model:"500", color:"white" }, { type:"ford", model:"5300", color:"gray" } ]; const newArr = arr.map(i => { const r = { ...i, power:2 } return r; }) console.log(newArr)

With array function you can implicitly

 const arr = [ { type:"Fiat", model:"500", color:"white" }, { type:"ford", model:"5300", color:"gray" } ]; const newArr = arr.map(i => ({...i, power: 2})); console.log(newArr)

Answer 2

您需要将获得的当前对象传播为：

const newArr = arr.map(i => ({ ...i, power: 2 }));

Answer 3

You want to do this, you are spreading arr and should be spreading the array getting passed to map (eg i ):

const newArr = arr.map(i => {
    const r = {
      ...i,
      power:2
    }
    return r
})