How to update a value in nested array based on the given index and return original array in javascript?

Question

I have an index '3_1_0' and the following array:-

var fields = [
    {
        name: 'a'
    },
    {
        name: 'b'
    },
    {
        name: 'c'
    },
    {
        name: 'd',
        fields: [
            {
                name: 'd1'
            },
            {
                name: 'd2',
                fields: [
                    {
                        name: 'd2.1'
                    }
                ]
            }
        ]
    }
]

I need to extract the element from the above fields array based on the index. so 3_1_0 will extract following

{
    name: 'd2.1'
}

Update the value from d2.1 to some other value like 'new_d2.1' and attach the updated value at the same index in original fields array and return the updated fields array. How this can be done?

Terry Lennox · Accepted Answer · 2021-07-30 10:35:21Z

2

You can use Array.reduce to get the desired result. We start by splitting the index into an array, then reducing to get the result.

We'll use some Optional Chaining to ensure we'll return undefined if no value is found (say our index was '7_10_20').

Once we've found our object, we can set the required property.

const fields = [ { name: 'a' }, { name: 'b' }, { name: 'c' }, { name: 'd', fields: [ { name: 'd1' }, { name: 'd2', fields: [ { name: 'd2.1' } ] } ] } ];

const index = '3_1_0'

function setValue(fields, index, property, value) {
    const obj = index.split('_').reduce((acc, key) => { 
       return acc?.[key] || acc?.fields?.[key];
    }, fields);
    // Only update if we actually find anything
    if (obj) { 
        obj[property] = value
    }
}

setValue(fields, '3_1_0', 'name', 'new_d2.1');

console.log("Fields:", fields);

edited Jul 30, 2021 at 10:35

answered Jul 30, 2021 at 10:01

Terry Lennox

30.9k5 gold badges36 silver badges45 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

ikhvjs Over a year ago

I never notice arr["0"] is implicitly converted as the arr[0].

Terry Lennox Over a year ago

It's effectively the same thing I believe, one would have to look at the ECMA spec. to see exactly how it should be handled. One could always do a .map after the split like index.split('_').map(n => +n), but I don't think it's strictly necessary.

D.K Over a year ago

Thanks for the answer, I am looking to get the original array back with name updated to new_d2.1 at 3_1_0 position

ikhvjs Over a year ago

@TerryLennox, Yes. They are the same thing, even happen in the object. I just never notice it before.

Terry Lennox Over a year ago

Appreciate the feedback @D.K. I've updated!

Harsh Saini · Accepted Answer · 2021-07-30 09:59:09Z

0

const data = [{ name: 'a' }, { name: 'b' }, { name: 'c' }, { name: 'd', fields: [ { name: 'd1' }, { name: 'd2', fields: [ { name: 'd2.1' } ] } ] } ];

let givenIdxs = "3_1_0";

let indexes = givenIdxs.split("_");

let result = data[indexes[0]];

for(let idx = 1; idx < indexes.length; idx++){
  result = result.fields[indexes[idx]];
}

console.log(result);

answered Jul 30, 2021 at 9:59

Harsh Saini

6365 silver badges13 bronze badges

Collectives™ on Stack Overflow

How to update a value in nested array based on the given index and return original array in javascript?

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related