Как правильно сделать изменения в массиве?

Question

[kolaluka]

const id = 2;
const arr = [{title: 'test', id: 1, children: []}, {title: 'test1', id: 2, children: [{title: 'first children'}]}]

Мне приходит id и нужно по id найти объект в массиве и этому массиву в children добавить новый объект, как такое сделать, не изменяя первоначальный массив?

должно получится что-то типа такого

[{title: 'test', id: 1, children: []}, {title: 'test1', id: 2, children: [{title: 'first children'}, {title: 'second children'}]}]

так я понимаю, мутирую первоначальный массив.

arr.map((item) => if (item.id === id) {
item.children.push({title: 'second children'});
return item
}
 item)

Спасибо.

Comments

[Евгений]

Дока говорит:

Метод map() создаёт новый массив с результатом вызова указанной функции для каждого элемента массива.

Т.е. все что делается в коллбэке - не мутирует исходный массив....
Или я ошибаюсь?

[Yuriy Vorobyov]

Пройдитесь обычным for

[reinmaker90]

вот , думаю там же найдете кучу методов перебора которые не мутируют исходный массив

[WbICHA]

reinmaker90, ID уникальный, какой нафиг фильтр? Чего все его так любят пихать везде, даже там, где он не уместен?

[WbICHA]

kolaluka, ты не знаешь как работают массивы и объекты? А вернее что хранится в переменных?
Это риторический вопрос, советую почитать документацию. В том числе про метод мап.

[reinmaker90]

WbICHA, bad practices

Answer 1

[Sergey Romanov]

let r = arr.find(element => element.id === id)
if (r !== undefined) {
    r.children.push({title: 'second children'})
}

или небольшой читинг в одной строке.

(arr.find(element => element.id === id) || {children:[]}).children.push({titel:"new"});

Comments

[WbICHA]

Только 1 момент не учтён: undefined в случае, если ид не найден.

[WbICHA]

или небольшой читинг в одной строке.

Не, это не читинг, вот читинг:

arr.find(el => el.id === id)?.children.push({ title:"new" });