continously add to an objects key value in javascript

Question

I am running a loop over some data. I have an object with a key value message. Every time I loop over my array I want to append to this objects key value, I tried using spread operator but not having any luck

  const arr1 = [
    "keith",
    "kelly",
    "ed",
    "shelby"
]

const arr2 = [
    "Parker",
    "Morgan",
    "Arnold",
    "Suski",
    "Parks"
]

const addToObjectsMessageKey = arr1.map((name) => {
 let obj = {}
    arr2.forEach((lastName) => { return {...obj, message: ...obj.message + name}})
 return obj
})

console.log(addToObjectsMessageKey)

expected output

addObjectsToMessageKey = [
{ message: "Parker Morgan Arnold Suski Parks" },
{ message: "Parker Morgan Arnold Suski Parks" },
{ message: "Parker Morgan Arnold Suski Parks" },
{ message: "Parker Morgan Arnold Suski Parks" },
]

Answer 1

Looks like you want to overwrite the arr1 elements to an object with all the elements on the arr2 joined by space, you can simplify this using arr.join MDN documentation instead of forEach

const arr1 = ["keith", "kelly", "ed", "shelby"];

const arr2 = ["Parker", "Morgan", "Arnold", "Suski", "Parks"];

const addToObjectsMessageKey = arr1.map(() => {
  return {
    message: arr2.join(" ")
  };
});

console.log(addToObjectsMessageKey);

Here is a codeSandbox:

https://codesandbox.io/s/agitated-mestorf-tlhkh2?file=/src/index.js:0-248

Is this what you want?