Как я могу изменить значение массива (внутри массива объектов) без изменения контейнера? javascript

#javascript #arrays #loops #object #mutation

#javascript #массивы #циклы #объект #мутация

Вопрос:

чего я хочу добиться, так это заполнения массива «presents» значением arr, когда имя «Mario» в этом случае я получаю изменение массива «present», но то, что я хочу, — это немутативный массив, только измените значение пустого массива на значениедругой массив (в данном случае я ставлю arr в качестве примера)

 let present= [
    {
      name: "Peter",
      presents: []
    },
    {
      name: "Mario",
      presents: []
    },
    {
      name: "Amanda",
      presents: []
    },
    {
      name: "David",
      presents: []
    }
]
arr = ["car","coal"]

const res= present.map(s =>s.name == "Mario" ? s.presents.concat(arr) : [])

console.log(res)
 

Что я хочу получить:

 let present= [
    {
      name: "Peter",
      presents: []
    },
    {
      name: "Mario",
      presents: ["car","coal"]
    },
    {
      name: "Amanda",
      presents: []
    },
    {
      name: "David",
      presents: []
    }
]
 

pd: извините, я не смог объяснить лучше, все еще изучая английский.

Ответ №1:

Вы можете сделать следующее, используя reduce(),

 const present = [{ name: "Peter", presents: [] }, { name: "Mario", presents: [] }, { name: "Amanda", presents: [] }, { name: "David", presents: [] } ],
arr = ["car", "coal"],

res = present.reduce((prev, curr) => {
  if(curr.name === 'Mario') {
    prev.push({...curr, presents: [...curr.presents, ...arr]})
  } else {
    prev.push(curr);
  }
  return prev;
}, []);
console.log(res); 

Ответ №2:

Вы можете распространить объекты и добавить нужный массив.

 const
    present = [{ name: "Peter", presents: [] }, { name: "Mario", presents: [] }, { name: "Amanda", presents: [] }, { name: "David", presents: [] } ],
    array = ["car", "coal"],
    result = present.map(({ presents, ...o }) => ({
        ...o,
        presents: [...presents, ...(o.name === "Mario" ? array : [])]
    }));

console.log(result); 
 .as-console-wrapper { max-height: 100% !important; top: 0; }