Merge Array & Array of Objects

Question

Attempting to merge an array of objects with array while keeping the order of the original array and adding any new values onto the end. Can this be accomplished using an ES6/ES7 syntax one-liner?

const arr1 = [7, 1, 2, 5, 8];

const arr2 = [
    {id: 8, type: "MultiChoiceMultiAnswer", name: "Another Test Property"},
    {id: 5, type: "MultiChoiceMultiAnswer", name: "test"},
    {id: 2, type: "Text", name: "Test Create Property"},
    {id: 10, type: "Label", name: "New Label"},
    {id: 1, type: "Text", name: "Test Text Property"},
    {id: 7, type: "Label", name: "This is a crazy new one"},
    {id: 9, type: "Text", name: "New Text"}
];

I have attempted the following which results in all the keys being added into an array with the desired order with the second array added as a new key on the end:

const arr3 = [];
arr3 = arr1.map(x => ([...arr1, arr2]));

Output:

arr3 = [
    [7, 1, 2, 5, 8,
    [
      {id: 8, type: "MultiChoiceMultiAnswer", name: "Another Test Property"},
      {id: 5, type: "MultiChoiceMultiAnswer", name: "test"},
      {id: 2, type: "Text", name: "Test Create Property"},
      {id: 10, type: "Label", name: "New Label"},
      {id: 1, type: "Text", name: "Test Text Property"},
      {id: 7, type: "Label", name: "This is a crazy new one"},
      {id: 9, type: "Text", name: "New Text"}
    ]
  ]
];

I have also attempted with which results in an array of falses:

const arr3 = [];
arr3 = arr1.map(id => arr3.push(arr2.id === id));

Output:

arr3 = [ false, false, false, false, false ];

The expected output is a merged, single array of objects:

const arr3 = [
    {id: 7, type: "Label", name: "This is a crazy new one"},
    {id: 1, type: "Text", name: "Test Text Property"},
    {id: 2, type: "Text", name: "Test Create Property"},
    {id: 5, type: "MultiChoiceMultiAnswer", name: "test"},
    {id: 8, type: "MultiChoiceMultiAnswer", name: "Another Test Property"},
    {id: 10, type: "Label", name: "New Label"},
    {id: 9, type: "Text", name: "New Text"}
];

It looks like you want us to write some code for you. While many users are willing to produce code for a coder in distress, they usually only help when the poster has already tried to solve the problem on their own. A good way to demonstrate this effort is to include the code you've written so far, example input (if there is any), the expected output, and the output you actually get (console output, tracebacks, etc.). The more detail you provide, the more answers you are likely to receive. Check the [tour] and [ask] — Luca Kiebel, May 14 '18 at 13:53
You can search for “one-liners” or ask what could be improved, after you show us your current solution ... — CBroe, May 14 '18 at 13:53
Updated with my current attempts - I have some how managed to generate an array full of `false`. — proph3t, May 14 '18 at 14:22

score 0 · Answer 1 · answered May 14 '18 at 14:00

You could use sort method and sort based on index of current element id in arr1.

const arr1 = [7, 1, 2, 5, 8];
const arr2 = [{"id":8,"type":"MultiChoiceMultiAnswer","name":"Another Test Property"},{"id":5,"type":"MultiChoiceMultiAnswer","name":"test"},{"id":2,"type":"Text","name":"Test Create Property"},{"id":10,"type":"Label","name":"New Label"},{"id":1,"type":"Text","name":"Test Text Property"},{"id":7,"type":"Label","name":"This is a crazy new one"},{"id":9,"type":"Text","name":"New Text"}]

arr2.sort((a, b) => {
  const iA = arr1.indexOf(a.id);
  const iB = arr1.indexOf(b.id);
  return ((iB != -1) - (iA != - 1)) || iA - iB
})

console.log(arr2)

score 0 · Answer 2 · answered May 14 '18 at 14:02

Try this

const arr1 = [7, 1, 2, 5, 8];

const arr2 = [{
    id: 8,
    type: "MultiChoiceMultiAnswer",
    name: "Another Test Property"
  },
  {
    id: 5,
    type: "MultiChoiceMultiAnswer",
    name: "test"
  },
  {
    id: 2,
    type: "Text",
    name: "Test Create Property"
  },
  {
    id: 10,
    type: "Label",
    name: "New Label"
  },
  {
    id: 1,
    type: "Text",
    name: "Test Text Property"
  },
  {
    id: 7,
    type: "Label",
    name: "This is a crazy new one"
  },
  {
    id: 9,
    type: "Text",
    name: "New Text"
  }
];

let output = [];

arr1.forEach(function(itm) {
  var indx = arr2.findIndex(function(itm2) {
    return itm == itm2.id;
  })
  if (indx != -1) {
    output.push(arr2[indx]);
    arr2.splice(indx, 1);
  }
});
arr2.forEach(itm => output.push(itm))
console.log(output)

Merge Array & Array of Objects

2 Answers2