How to iterate over two objects and update one's values based on the other in JS?

Question

How can I get this object's values populated, if its keys match the second object's keys?

Object to be populated

const task = {
      name: '',
      description: '',
      status: '',
      priority: '',
      due_date: '',
      due_date_time: '',
      parent: '',
      time_estimate: '',
      start_date: '',
      start_date_time: '',
      assignees: {},
      archived: ''
  }

Original Object

const taskData = { 
  id: '476ky1',
  custom_id: null,
  name: 'Reunião com o novo Gerente de Vendas - Airton',
  text_content: null,
  description: null,
  status: 
   { id: 'p3203621_11svBhbO',
     status: 'to do',
     color: '#d3d3d3',
     orderindex: 0,
     type: 'open' },
  orderindex: '1.16183176837360000000000000000000',
  date_created: '1618317683783',
  date_updated: '1618317683783',
  date_closed: null,
  archived: false,
  creator: 
   { id: 3184709,
     username: 'Michael Jackson',
     color: '#455963',
     email: '[email protected]',
     profilePicture: null },
  assignees: 
   [ { id: 3184709,
       username: 'Antonio Santos',
       color: '#455963',
       initials: 'AS',
       email: '[email protected]',
       profilePicture: null } ],
  watchers: 
   [ { id: 3184709,
       username: 'Antonio Santos',
       color: '#455963',
       initials: 'AS',
       email: '[email protected]',
       profilePicture: null } ],
  checklists: [],
  tags: [],
  parent: null,
  priority: null,
  due_date: null,
  start_date: null,
  points: null,
  time_estimate: null,
  time_spent: 0,
  custom_fields: [],
  dependencies: [],
  linked_tasks: [],
  team_id: '3101702',
  url: 'https://app.clickup.com/t/476ky1',
  permission_level: 'create',
  list: { id: '13700791', name: 'List', access: true },
  project: { id: '7328469', name: 'hidden', hidden: true, access: true },
  folder: { id: '7328469', name: 'hidden', hidden: true, access: true },
  space: { id: '3203621' },
  attachments: [] 
}

Now, don't condemn me yet, as I'm just starting to deal with objects and I'm sure that there are many ways to do it, but is for loop an approach to look at? It doesn't modify task object, right. So how would I go about returning task populated?

for(let a = 0; a < task.length; a++){
  for (let n = 0; n < data.length; a++){
    if(Object.keys(task) == Object.keys(data)){
      Object.values(task) = Object.values(data)
    }
  }
}

Appreciate your help!

Does this answer your question? [Fill fields in object, from other object](https://stackoverflow.com/questions/55103138/fill-fields-in-object-from-other-object) — Yogi, Oct 08 '22 at 23:46

score 6 · Accepted Answer · answered Oct 08 '22 at 23:47

You've already got the keys you want nicely defined in task, so we can simply loop through them using for (let k in task). If taskData[k] doesn't have a value this solution reverts to using an empty string. (Scroll to the bottom of the code block to see the solution!)

const taskData = { 
  id: '476ky1',
  custom_id: null,
  name: 'Reunião com o novo Gerente de Vendas - Airton',
  text_content: null,
  description: null,
  status: 
   { id: 'p3203621_11svBhbO',
     status: 'to do',
     color: '#d3d3d3',
     orderindex: 0,
     type: 'open' },
  orderindex: '1.16183176837360000000000000000000',
  date_created: '1618317683783',
  date_updated: '1618317683783',
  date_closed: null,
  archived: false,
  creator: 
   { id: 3184709,
     username: 'Michael Jackson',
     color: '#455963',
     email: '[email protected]',
     profilePicture: null },
  assignees: 
   [ { id: 3184709,
       username: 'Antonio Santos',
       color: '#455963',
       initials: 'AS',
       email: '[email protected]',
       profilePicture: null } ],
  watchers: 
   [ { id: 3184709,
       username: 'Antonio Santos',
       color: '#455963',
       initials: 'AS',
       email: '[email protected]',
       profilePicture: null } ],
  checklists: [],
  tags: [],
  parent: null,
  priority: null,
  due_date: null,
  start_date: null,
  points: null,
  time_estimate: null,
  time_spent: 0,
  custom_fields: [],
  dependencies: [],
  linked_tasks: [],
  team_id: '3101702',
  url: 'https://app.clickup.com/t/476ky1',
  permission_level: 'create',
  list: { id: '13700791', name: 'List', access: true },
  project: { id: '7328469', name: 'hidden', hidden: true, access: true },
  folder: { id: '7328469', name: 'hidden', hidden: true, access: true },
  space: { id: '3203621' },
  attachments: [] 
};

const task = {
    name: '',
    description: '',
    status: '',
    priority: '',
    due_date: '',
    due_date_time: '',
    parent: '',
    time_estimate: '',
    start_date: '',
    start_date_time: '',
    assignees: {},
    archived: ''
};

// Here's the solution!
for (let k in task) task[k] = taskData[k] ?? '';

console.log({ task });

Note that if you're sure taskData contains a superset of the keys in task, you can simply use:

for (let k in task) task[k] = taskData[k];

Nick · Answer 2 · 2022-10-09T00:25:20.447

If all the keys in task exist in taskData, you can just iterate the keys using forEach to copy the data:

Object.keys(task).forEach(k => task[k] = taskData[k])

Note

This will copy references to anything in taskData which is not a primitive, so that if you modify one of them in task it will also change the value in taskData. If this is not desired behaviour, you should make a deep copy using one of the methods described in this Q&A.

const task = {
      name: '',
      description: '',
      status: '',
      priority: '',
      due_date: '',
      due_date_time: '',
      parent: '',
      time_estimate: '',
      start_date: '',
      start_date_time: '',
      assignees: {},
      archived: ''
  }
  
const taskData = { 
  id: '476ky1',
  custom_id: null,
  name: 'Reunião com o novo Gerente de Vendas - Airton',
  text_content: null,
  description: null,
  status: 
   { id: 'p3203621_11svBhbO',
     status: 'to do',
     color: '#d3d3d3',
     orderindex: 0,
     type: 'open' },
  orderindex: '1.16183176837360000000000000000000',
  date_created: '1618317683783',
  date_updated: '1618317683783',
  date_closed: null,
  archived: false,
  creator: 
   { id: 3184709,
     username: 'Michael Jackson',
     color: '#455963',
     email: '[email protected]',
     profilePicture: null },
  assignees: 
   [ { id: 3184709,
       username: 'Antonio Santos',
       color: '#455963',
       initials: 'AS',
       email: '[email protected]',
       profilePicture: null } ],
  watchers: 
   [ { id: 3184709,
       username: 'Antonio Santos',
       color: '#455963',
       initials: 'AS',
       email: '[email protected]',
       profilePicture: null } ],
  checklists: [],
  tags: [],
  parent: null,
  priority: null,
  due_date: null,
  start_date: null,
  points: null,
  time_estimate: null,
  time_spent: 0,
  custom_fields: [],
  dependencies: [],
  linked_tasks: [],
  team_id: '3101702',
  url: 'https://app.clickup.com/t/476ky1',
  permission_level: 'create',
  list: { id: '13700791', name: 'List', access: true },
  project: { id: '7328469', name: 'hidden', hidden: true, access: true },
  folder: { id: '7328469', name: 'hidden', hidden: true, access: true },
  space: { id: '3203621' },
  attachments: [] 
}

Object.keys(task).forEach(k => task[k] = taskData[k])

console.log(task)

This assigns the reference of anything that is not a primitive value. I'm not sure if OP wants this. — Christopher, Oct 08 '22 at 23:50
@Christopher thanks, I've made a note about that in the answer. — Nick, Oct 08 '22 at 23:55

ksav · Answer 3 · 2022-10-08T23:57:37.717

Another way to approach this task is to filter the original object by some allowed keys.

const taskData={id:"476ky1",custom_id:null,name:"Reuni\xe3o com o novo Gerente de Vendas - Airton",text_content:null,description:null,status:{id:"p3203621_11svBhbO",status:"todo",color:"#d3d3d3",orderindex:0,type:"open"},orderindex:"1.16183176837360000000000000000000",date_created:"1618317683783",date_updated:"1618317683783",date_closed:null,archived:!1,creator:{id:3184709,username:"Michael Jackson",color:"#455963",email:"[email protected]",profilePicture:null},assignees:[{id:3184709,username:"Antonio Santos",color:"#455963",initials:"AS",email:"[email protected]",profilePicture:null}],watchers:[{id:3184709,username:"Antonio Santos",color:"#455963",initials:"AS",email:"[email protected]",profilePicture:null}],checklists:[],tags:[],parent:null,priority:null,due_date:null,start_date:null,points:null,time_estimate:null,time_spent:0,custom_fields:[],dependencies:[],linked_tasks:[],team_id:"3101702",url:"https://app.clickup.com/t/476ky1",permission_level:"create",list:{id:"13700791",name:"List",access:!0},project:{id:"7328469",name:"hidden",hidden:!0,access:!0},folder:{id:"7328469",name:"hidden",hidden:!0,access:!0},space:{id:"3203621"},attachments:[]};

const allowedKeys = ['name', 'description', 'status']; // etc. Add all the keys you want to keep here

const filtered = Object.fromEntries(
  Object.entries(taskData).filter(
    ([key, val]) => allowedKeys.includes(key)
  )
);

console.log(filtered)

Thanks for your answer. I'm not sure this is filtering the object in its entirety, though — onit, Oct 08 '22 at 23:54
Just add all the keys you want to keep to the `allowedKeys` array. — ksav, Oct 08 '22 at 23:55
Felt like deleting my comment for its/my stupidity. Thank you! — onit, Oct 08 '22 at 23:56

How to iterate over two objects and update one's values based on the other in JS?

3 Answers3