I have an existing array of ids that I'm trying to iterate over to add each as an id: key to an existing array of objects. I have tried a number of different loops (for, for in, map, forEach), but I keep having the same oute - it only adds the first id to each object, so id: 'a' x 6

An example of what I have

const ids = ['a','b','c','d','e','f']

const objArr = [
  {
   property: "some value",
  }
  {
   property: "some value",
  }
  {
   property: "some value",
  }
  {
   property: "some value",
  }
  {
   property: "some value",
  }
  {
   property: "some value",
  }
]
   

An example of what I want to achieve

const objArr = [
  {
   property: "some value",
   id: 'a'
  }
  {
   property: "some value",
   id: 'b'
  }
  {
   property: "some value",
   id: 'c'
  }
  {
   property: "some value",
   id: 'd'
  }
  {
   property: "some value",
   id: 'e'
  }
  {
   property: "some value",
   id: 'f'
  }
]

Here is an example of a forEach loop with a nested for in loop which I have tried to no avail.

ids.forEach((item) => {
    for (const key in objArr) {
      objArr[key].id = item
    }
  })

Can anyone explain what I'm doing wrong and how to achieve what I'm trying to do?

I have an existing array of ids that I'm trying to iterate over to add each as an id: key to an existing array of objects. I have tried a number of different loops (for, for in, map, forEach), but I keep having the same oute - it only adds the first id to each object, so id: 'a' x 6

An example of what I have

const ids = ['a','b','c','d','e','f']

const objArr = [
  {
   property: "some value",
  }
  {
   property: "some value",
  }
  {
   property: "some value",
  }
  {
   property: "some value",
  }
  {
   property: "some value",
  }
  {
   property: "some value",
  }
]
   

An example of what I want to achieve

const objArr = [
  {
   property: "some value",
   id: 'a'
  }
  {
   property: "some value",
   id: 'b'
  }
  {
   property: "some value",
   id: 'c'
  }
  {
   property: "some value",
   id: 'd'
  }
  {
   property: "some value",
   id: 'e'
  }
  {
   property: "some value",
   id: 'f'
  }
]

Here is an example of a forEach loop with a nested for in loop which I have tried to no avail.

ids.forEach((item) => {
    for (const key in objArr) {
      objArr[key].id = item
    }
  })

Can anyone explain what I'm doing wrong and how to achieve what I'm trying to do?

• javascript
• arrays
• loops
• object
• ecmascript-6

• 2 Your array is invalid. The mas should go between the objects. – Andy Commented Feb 21, 2023 at 19:57
• Each iteration through objArr is overwriting the previous iteration's key. – mykaf Commented Feb 21, 2023 at 19:59
• @Andy sorry, missed that whilst writing it out. Will add for clarity. – i-am-niall Commented Feb 22, 2023 at 14:19

2 Answers 2

Just loop through objArr array and on each item inside add an id property which it's value equal to the item with the same index on the ids array.

const ids = ['a', 'b', 'c', 'd', 'e', 'f']

const objArr = [{
  property: "some value",
}, {
  property: "some value",
}, {
  property: "some value",
}, {
  property: "some value",
}, {
  property: "some value",
}, {
  property: "some value",
}]

objArr.forEach((item, index) => {
  item.id = ids[index];
})

console.log(objArr);

You are going through both arrays, but you only need to go through one and work with the index:

ids.forEach((id, index) => {
  objArr[index].id = id
})