How to add dynamic key with value in existing Javascript object? [duplicate]

Question

I have an existing javascript object.

let existingObject = {
    1: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    },
    2: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    },
    3: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    }
}

I want to add a property to that existing object. My new key value is:

const key = 4;
const value = {
    'prop1': 'prop1 value',
    'prop2': 'prop2 value'
}

After appending the key and value, my new object should be,

const newObject = {
    1: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    },
    2: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    },
    3: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    },
    4: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    }
}

Here the key is a dynamic value. Whenever I try to append this key-value, the key is becoming the variable name.

How can I solve this issue?

NB: For creating the existing object I am using lodash.

Possible duplicate of How can I add a key/value pair to a JavaScript object? and JavaScript set object key by variable — adiga
– adiga, Commented Feb 10, 2019 at 5:26
If you want consecutive numeric keys, why don't you use an array? — adiga
– adiga, Commented Feb 10, 2019 at 5:28

Shidersz · Accepted Answer · 2020-11-27 22:33:46Z

8

You can do this with Object.assign() and using Computed Property names (example {[key]: value}):

let existingObject = {
    1: {'prop1': 'prop1 value', 'prop2': 'prop2 value'},
    2: {'prop1': 'prop1 value', 'prop2': 'prop2 value'},
    3: {'prop1': 'prop1 value', 'prop2': 'prop2 value'}
}

const key = 4;
const value = {'prop1': 'prop1 value', 'prop2': 'prop2 value'}

Object.assign(existingObject, {[key]: value});
console.log(existingObject);

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

But, as others have commented to you, this is easy as just:

existingObject[key] = value;

edited Nov 27, 2020 at 22:33

answered Feb 10, 2019 at 5:27

Shidersz

17.2k2 gold badges28 silver badges52 bronze badges

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

Collectives™ on Stack Overflow

How to add dynamic key with value in existing Javascript object? [duplicate]

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related