Update a value in a nested array while maintaining original indexes ES6

Question

I want to update a value in a nested array and return the updated array. This should all be in ES6. I may have over 2000 children and I have only the id from the object that should be updated.

My array looks like:

let data = [{
    title: 'Name 1',
    key: '0-0',
    children: [{
        title: 'Name 1-1',
        key: '0-0-0',
        id: 4,
        children: [{
                title: 'Name 1-3',
                key: '0-0-0-0',
                id: 3,
                visibility: false,
                children: [{
                    title: 'Name 1-4',
                    key: '0-0-0-0',
                    id: 34,
                    visibility: false // this need to be updated
                }]
            },
            {
                title: 'Name 2-1',
                key: '0-0-1',
                id: 1,
                visibility: false
            }
        ]
    }]
}];

Thanks for help.

do you want to updatte or to get a whole new data structure with the updated item? btw, what have you tried? — Nina Scholz, Nov 20 '18 at 21:20
you need something like map and then a rekursive function over all childreans — otto, Nov 20 '18 at 21:22
Did you look around? This question must have been asked many times before. — trincot, Nov 20 '18 at 21:28

score 2 · Answer 1 · answered Nov 20 '18 at 21:42

You can do something like this via a recursive function:

let data = [{ title: 'Name 1', key: '0-0', children: [{ title: 'Name 1-1', key: '0-0-0', id: 4, children: [{ title: 'Name 1-3', key: '0-0-0-0', id: 3, visibility: false, children: [{ title: 'Name 1-4', key: '0-0-0-0', id: 34, visibility: false }] }, { title: 'Name 2-1', key: '0-0-1', id: 1, visibility: false } ] }] }]

const findById = (data, id) => {
  var found, s = (d, id) => d.find(x => x.id == id ? found = x : s(x.children, id))    
  s(data, id)
  return found ? found : false
}

let el = findById(data, 34)
el.visibility = true

console.log(el)
console.log(data)

This will also find the element and return it so you can change anything you want on it.

Update a value in a nested array while maintaining original indexes ES6

1 Answers1