add objects in existing object in javascript

Question

we have an object called options. I wanted to append in options those values, which are not present from object2 based on id.

options
0: {value: '642a60e2573c9d004b041407', label: 'label1', mapped: true}
1: {value: '642a60e2573c9d004b041408', label: 'label2', mapped: true}
2: {value: '642a60e2573c9d004b041409', label: 'label3', mapped: true}
3: {value: '642a60e2573c9d004b04140a', label: 'label4', mapped: true}
4: {value: '642a60e2573c9d004b04140b', label: 'label5 ', mapped: true}
5: {value: '642a60e2573c9d004b04140c', label: 'label6', mapped: true}


object2 = 
642a60e2573c9d004b04140a: {id: '642a60e2573c9d004b04140a', createdAt: '2023-04-03T05:15:14.316Z', myApiName: null, abel: null}
642a60e2573c9d004b04140b: {id: '642a60e2573c9d004b04140b', createdAt: '2023-04-03T05:15:14.316Z', myApiName: null, abel: null}
642a60e2573c9d004b04140c: {id: '642a60e2573c9d004b04140c', createdAt: '2023-04-03T05:15:14.316Z', myApiName: null, abel: null,}
642a60e2573c9d004b04140d: {id: '642a60e2573c9d004b04140d', createdAt: '2023-04-03T05:15:14.316Z', myApiName: null, abel: null, }
642a60e2573c9d004b04140e: {id: '642a60e2573c9d004b04140e', createdAt: '2023-04-03T05:15:14.317Z', myApiName: null, abel: null, }
642a60e2573c9d004b04140f: {id: '642a60e2573c9d004b04140f', createdAt: '2023-04-03T05:15:14.317Z', myApiName: null, abel: null, }
642a60e2573c9d004b041407: {id: '642a60e2573c9d004b041407', createdAt: '2023-04-03T05:15:14.315Z', myApiName: null, abel: null, }
642a60e2573c9d004b041408: {id: '642a60e2573c9d004b041408', createdAt: '2023-04-03T05:15:14.316Z', myApiName: null, abel: null, }
642a60e2573c9d004b041409: {id: '642a60e2573c9d004b041409', createdAt: '2023-04-03T05:15:14.316Z', myApiName: null, abel: null, }
642a6123573c9d0024a992f2: {id: '642a6123573c9d0024a992f2', createdAt: '2023-04-03T05:16:19.896Z', myApiName: null, abel: null, }

Since, I am new to JS, any help would be appreciated.

Expected result:

options
        0: {value: '642a60e2573c9d004b041407', label: 'label1', mapped: true}
        1: {value: '642a60e2573c9d004b041408', label: 'label2', mapped: true}
        2: {value: '642a60e2573c9d004b041409', label: 'label3', mapped: true}
        3: {value: '642a60e2573c9d004b04140a', label: 'label4', mapped: true}
        4: {value: '642a60e2573c9d004b04140b', label: 'label5 ', mapped: true}
        5: {value: '642a60e2573c9d004b04140c', label: 'label6', mapped: true}
        6: {value: '642a6123573c9d0024a992f2', label: 'label7', mapped: true}
        7: {value: '642a60e2573c9d004b04140d', label: 'label5 ', mapped: true}
        8: {value: '642a60e2573c9d004b04140e', label: 'label6', mapped: true}
        9: {value: '642a60e2573c9d004b04140f', label: 'label7', mapped: true}```

start by posting some syntactically valid javascript. Also, what is the expected result? — gog, Apr 04 '23 at 10:36
duplicate [JavaScript merging objects by id](https://stackoverflow.com/questions/19480008/javascript-merging-objects-by-id) or [Merge two array of objects based on a key](https://stackoverflow.com/questions/46849286/merge-two-array-of-objects-based-on-a-key) — pilchard, Apr 04 '23 at 10:38
@sagarverma Should the options list get longer, or should it remain the same length but with each object in the options list having information from the object2 objects? — Ben Stephens, Apr 04 '23 at 10:48
list can be longer, and yes options object should be appended with those which are present from object2. — sagar verma, Apr 04 '23 at 11:02
How are the labels generated for the items new to `options`, is mapped always true? — Ben Stephens, Apr 04 '23 at 11:08

score 1 · Answer 1 · answered Apr 04 '23 at 10:40

You can map over the options object and add elements from the other object. This might solve your problem.

const optionsMap = options.map(option => {
  return {
    ...option,
    ...object2.find(obj => obj.id === option.value)
  }
});

options = [{
  value: '642a60e2573c9d004b041407',
  label: 'label1',
  mapped: true
}, {
  value: '642a60e2573c9d004b041408',
  label: 'label2',
  mapped: true
}, {
  value: '642a60e2573c9d004b041409',
  label: 'label3',
  mapped: true
}, {
  value: '642a60e2573c9d004b04140a',
  label: 'label4',
  mapped: true
}, {
  value: '642a60e2573c9d004b04140b',
  label: 'label5 ',
  mapped: true
}, {
  value: '642a60e2573c9d004b04140c',
  label: 'label6',
  mapped: true
}, ]

object2 = [{
    id: '642a60e2573c9d004b04140a',
    createdAt: '2023-04-03T05:15:14.316Z',
    myApiName: null,
    abel: null
  }, {
    id: '642a60e2573c9d004b04140b',
    createdAt: '2023-04-03T05:15:14.316Z',
    myApiName: null,
    abel: null
  }, {
    id: '642a60e2573c9d004b04140c',
    createdAt: '2023-04-03T05:15:14.316Z',
    myApiName: null,
    abel: null,
  },
  {
    id: '642a60e2573c9d004b04140d',
    createdAt: '2023-04-03T05:15:14.316Z',
    myApiName: null,
    abel: null,
  },
  {
    id: '642a60e2573c9d004b04140e',
    createdAt: '2023-04-03T05:15:14.317Z',
    myApiName: null,
    abel: null,
  },
  {
    id: '642a60e2573c9d004b04140f',
    createdAt: '2023-04-03T05:15:14.317Z',
    myApiName: null,
    abel: null,
  },
  {
    id: '642a60e2573c9d004b041407',
    createdAt: '2023-04-03T05:15:14.315Z',
    myApiName: null,
    abel: null,
  },
  {
    id: '642a60e2573c9d004b041408',
    createdAt: '2023-04-03T05:15:14.316Z',
    myApiName: null,
    abel: null,
  },
  {
    id: '642a60e2573c9d004b041409',
    createdAt: '2023-04-03T05:15:14.316Z',
    myApiName: null,
    abel: null,
  },
  {
    id: '642a6123573c9d0024a992f2',
    createdAt: '2023-04-03T05:16:19.896Z',
    myApiName: null,
    abel: null,
  }
];

const optionsMap = options.map(option => {
  return {
    ...option,
    ...object2.find(obj => obj.id === option.value)
  }
});
console.log('result', optionsMap);

@sagarverma How's the label string generated? where does `label7` come from? Is `mapped` always `true`? — Nils Kähler, Apr 04 '23 at 11:32
covered in the [duplicate](https://stackoverflow.com/a/51672402/13762301) flag to close — pilchard, Apr 04 '23 at 11:49

score 0 · Answer 2 · edited Apr 10 '23 at 10:55

I found this solution, which is working, you can refer this.

console.log(options);
var addNewItem = true;
Object.entries(object2).forEach((ele, index) => {
    addNewItem = true;
    Object.entries(options).forEach((item, inx) => {
        if (item[1].value == ele[1].id) {
            addNewItem = false;
            return false;
        }
    })
    if (addNewItem) {
        var keyVal = Object.keys(options).length;
        let newobj={[keyVal]: { value: ele[1].id, label: "newLable", mapped: true }}
        options = Object.assign(options, newobj)
    }
})

console.log(options);

add objects in existing object in javascript

2 Answers2