Update nested attributes in a JavaScript object

Question

I want to change 'hello' to 'hey' programmatically, the solution should work with any number of nested elements (I just use 2 levels to keep it simple).

var data = {level1: {level2 : 'hello' }};

I have access to the 'data' variable, the path ('level1/level2') and the new value ('hey').

I tried to do:

var parents = 'level1/level2'.split('/');
var target = data;
for(var i=0; i<parents.length; i++){
   target = data[parents[i]];
}
target = 'hey';

The idea was to travel to the root

target = data

then 1 level deep

target = data['level1']

...keep going

target = data['level1']['level2'] //data['level1'] === target

and modify the contents

target = 'hey'

But it looks like a lose the reference to the original object (data) when I do (target = target['level2']).

I guess I can build a string with the path and then evaluate it:

eval("data['level1']['level2']='hey');

Is there a better solution that dosen't involve eval()?

"...lose the reference to the original object" then don't...keep a variable pointing to the original data object — Liviu T.
– Liviu T., Commented Aug 20, 2012 at 6:54

JJJ · Accepted Answer · 2012-08-20 07:00:04Z

4

There are two issues. First is that you keep using data inside the loop, which means you're trying to access the top level keys instead of the inner keys. Change target = data[parents[i]]; to

target = target[parents[i]];

The second is that when you change the variable target, you're not changing the data variable but target instead. If you drop out of the loop one iteration earlier you can update the object which is stored as a reference:

for(var i=0; i<parents.length-1; i++){
   target = target[parents[i]];
}
target[parents[i]] = 'hey';

Demo: http://jsfiddle.net/Lherp/

answered Aug 20, 2012 at 7:00

JJJ

33.2k20 gold badges95 silver badges103 bronze badges

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

Comments

Michael · Accepted Answer · 2012-08-20 07:02:57Z

1

Try something like this:

var data = {level1: {level2 : 'hello' }};
var parents = 'level1/level2'.split('/');
var target = data;
for(var i=0; i < parents.length - 1; i++){
   target = target[parents[i]];
}
target[parents[i]] = 'hey';

Or am I missing something?

edit: I was missing something (sorry, should have tested it first..)

edited Aug 20, 2012 at 7:02

answered Aug 20, 2012 at 6:56

Michael

2,29115 silver badges14 bronze badges

2 Comments

cnandreu Over a year ago

That's what I posted, no? console.log(data.level1.level2) outputs 'hello' instead of 'hey'.

JJJ Over a year ago

Changing the target variable doesn't update the data object.

Collectives™ on Stack Overflow

Update nested attributes in a JavaScript object

2 Answers 2

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related