Update JavaScript Object

Question

I know there are some similar questions, but non of them could not help me with my issue:

I have an Object:

var mapOptions = {
        legend: {
            data:[
                {name: 'Europe', backgroundColor: 'RGB(228,101,41)'},
                {name: 'APAC', backgroundColor: 'RGB(0,71,126)'},
                {name: 'MENEAT', backgroundColor: 'RGB(145,0,73)'}
            ],
        }
    }

This object should be updated by this object:

var newOptions = {
          legend: {
            data: [
                {name: 'Europe', backgroundColor: 'green'},
            ]
          }
    }

What should the update function be able to do:

Update attributes: From 'RGB(228,101,41)' to 'green'
Delete do not needed items: E.g. Only 'Europe' item should remain.

For now I use the jQuery extend/deep function:

$.extend(true, mapOptions, newOptions);

It works partly. Only the Attributes are updated.

Can anybody help me to achieve the second point, how to delete/add items?

Or should I split it in 2 functions better?

Thank you for any help!

Update attributes: From 'RGB(228,101,41)' to 'green' not all RGB values have english names. What do you want to do in that case? — mehulmpt
– mehulmpt, Commented Feb 28, 2017 at 10:43
@MehulMohan Pointed the first problem. Second problem, based on what do you want to remove an item ? You only want to keep 'Europe' ? What if there is multiple times 'Europe' ? — Weedoze
– Weedoze, Commented Feb 28, 2017 at 10:44
You can just set the new object in place of the old: mapOptions.legend.data = newOptions.legend.data — Rory McCrossan
– Rory McCrossan, Commented Feb 28, 2017 at 10:48
2.Problem: Yes I want just keep newOptions.data. Other Items should be deleted — Jochen Schneider
– Jochen Schneider, Commented Feb 28, 2017 at 10:51

rdubya · Accepted Answer · 2017-02-28 10:47:44Z

1

Based on your example, the solution could be a basic assignment:

mapOptions.legend.data = newOptions.legend.data

answered Feb 28, 2017 at 10:47

rdubya

2,9261 gold badge18 silver badges21 bronze badges

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

1 Comment

Jochen Schneider Over a year ago

Problem is that there are more than data attributes in this object. It seems like that every of them must be set witha basic assigment. Thanks for help

ScaisEdge · Accepted Answer · 2017-02-28 10:50:34Z

1

If you want just change the first valeus You could use the relative index position (0) inside the data array

 mapOptions.legend.data[0] =   {name: 'Europe', backgroundColor: 'green'};

if the you want change all the data contente then you can use the javascript dot notation for accessing object element

mapOptions.legend.data =   {name: 'Europe', backgroundColor: 'green'};

edited Feb 28, 2017 at 10:50

answered Feb 28, 2017 at 10:45

ScaisEdge

134k10 gold badges98 silver badges111 bronze badges

1 Comment

ScaisEdge Over a year ago

@RoryMcCrossan thank answer extended for full change

Mithu CN · Accepted Answer · 2017-02-28 10:52:33Z

0

Try this

mapOptions.legend.data =   {name: 'Europe', backgroundColor: 'green'};

answered Feb 28, 2017 at 10:52

Mithu CN

5955 silver badges11 bronze badges

Comments

Nina Scholz · Accepted Answer · 2017-02-28 11:06:12Z

For more than one item to update, you could use a hash table with a reference to the objects and iterate then the update array.

If hash is set for a given name, update, otherwise push the new object to the array.

var mapOptions = { legend: { data: [{ name: 'Europe', backgroundColor: 'RGB(228,101,41)' }, { name: 'APAC', backgroundColor: 'RGB(0,71,126)' }, { name: 'MENEAT', backgroundColor: 'RGB(145,0,73)' }], } },
    newOptions = { legend: { data: [{ name: 'Europe', backgroundColor: 'green' }, ] } },
    hash = Object.create(null);

mapOptions.legend.data.forEach(function (a, i) {
    hash[a.name] = a;
});

newOptions.legend.data.forEach(function (a) {
    if (hash[a.name]) {
        hash[a.name].backgroundColor = a.backgroundColor;
    } else {
        mapOptions.legend.data.push(a);
    }
});

console.log(mapOptions.legend.data);

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

Collectives™ on Stack Overflow

Update JavaScript Object

4 Answers 4

1 Comment

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related