Array Map using JS - Compare values to another array and return value from second array

Question

I'd like to map this table's chapter_id and brother_id with the brothers and chapters table below and return the brothername and name field's respectively. Using js or jquery. I am using vuejs returning minutes array as a computed property. See below.

In sql it's be something like

select brothername from brothers where minute.brother_id = brothers.id ... and then set the brothername as the new value for brother_id

same thing goes for chapter_id:

select brothername from brothers where minute.brother_id = brothers.id ... and then set the brothername as the new value for brother_id

the resulting array or object should be:

Expected Array

[
   {
      "location":"UCLA",
      "chapter_id":"Beta", 
      "brother_id":"Golpher", 
      "created_at":"2008-05-15 22:23:00",
      "status":"Approved"
   },
   { ... },
   {
      "location":"John's Deli",
      "chapter_id":"Beta", notice the change in the array based on the ids
      "brother_id":"Sheera", notice the change in the array based on the ids
      "created_at":"2008-05-15 22:23:00",
      "status":"Approved"
   }
]

Minutes Table (original array)

[
   {
      "location":"UCLA",
      "chapter_id":2,
      "brother_id":1,
      "created_at":"2008-05-15 22:23:00",
      "status":"Approved"
   },
   { ... },
   {
      "location":"John's Deli",
      "chapter_id":2,
      "brother_id":4,
      "created_at":"2008-05-15 22:23:00",
      "status":"Approved"
   }
]

Chapter's Table

[
   {
      "id":1,
      "letter_representation":"A",
      "name":"Alpha",
      "founded_at":"UCLA",
      ...
   },
   { ... }
]

Brother's Table

[
   {
      "id":1,
      "profile_id":1,
      "chapter_id":1,
      "brothername":"Golpher",
      "firstname":"Jack",
      ...
   },
   { ... },
   {
      "id":4,
      "profile_id":4,
      "chapter_id":1,
      "brothername":"Sheera",
      "firstname":"Jake",
      ...
   }
]

Vue.js

computed: {
    brothers () {
        return this.$store.state.brothers
    },
    chapters () {
        return this.$store.state.chapters
    },
    minutes () {
        return this.$store.getters.model
    }
},

Answer 1

I think you should prepare those values first just to better understanding. So I made this, let me explain in pieces.

Your input information:

var minutesTable = [{
  "location": "UCLA",
  "chapter_id": 2,
  "brother_id": 1,
  "created_at": "2008-05-15 22:23:00",
  "status": "Approved"
}, {
  "location": "John's Deli",
  "chapter_id": 2,
  "brother_id": 4,
  "created_at": "2008-05-15 22:23:00",
  "status": "Approved"
}],
    chapterTable = [{
  "id": 1,
  "letter_representation": "A",
  "name": "Alpha",
  "founded_at": "UCLA",
}],
    brotherTable = [{
  "id": 1,
  "profile_id": 1,
  "chapter_id": 1,
  "brothername": "Golpher",
  "firstname": "Jack",
}, {
  "id": 4,
  "profile_id": 4,
  "chapter_id": 1,
  "brothername": "Sheera",
  "firstname": "Jake",
}];

Somehow you'll be forced to take this information as variables. We will work with that.

Preparing data

Dealing with array of objects it's a litle bit complicated when you need to look for unique informations on each object from distinct arrays especially if you want to run this more than once. So instead of working with arrays of objects we can save our lifes changing that to objects of objects, where each item index must be that unique IDs. Look:

var chapters = {},
    brothers = {};
chapterTable.map(function(el, i) {
    chapters[el.id] = el;
});
brotherTable.map(function(el, i) {
    brothers[el.id] = el;
});

Now you can easily find a chapter by chapter_id or a brother by brother_id, right? Then you can finish the problem like this:

var output = [];
minutesTable.map(function(el, i) {
    var item = {
        "location": el.location, // note that values are just default values, just in case
        "chapter_id":"-", 
        "brother_id":"-", 
        "created_at": el.created_at,
        "status": el.status
    };
    // PS: you need to check if that brother_id really exists!
    if(brothers[el.brother_id] != undefined) {
        item.brother_id = brothers[el.brother_id].brothername;
    }
    // PS: the same with chapters
    if(chapters[el.chapter_id] != undefined) {
        item.chapter_id = chapters[el.chapter_id].name;
    }
    output.push(item);
});

That's it. Anyway, if you can change your SQL queries, would be better to work with SQL joins and prepare your values there.

Answer 2

This should be what you need

const minutesTable = [
   {
      "location":"UCLA",
      "chapter_id":2,
      "brother_id":1,
      "created_at":"2008-05-15 22:23:00",
      "status":"Approved"
   },
   {
      "location":"John's Deli",
      "chapter_id":2,
      "brother_id":4,
      "created_at":"2008-05-15 22:23:00",
      "status":"Approved"
   }
]
const chapterTable = 
[
   {
      "id":1,
      "letter_representation":"A",
      "name":"Alpha",
      "founded_at":"UCLA",
   }
]
const brotherTable = [
   {
      "id":1,
      "profile_id":1,
      "chapter_id":1,
      "brothername":"Golpher",
      "firstname":"Jack",
   },
   {
      "id":4,
      "profile_id":4,
      "chapter_id":1,
      "brothername":"Sheera",
      "firstname":"Jake",
   }
]
/* code starts here */
let newMinutesTable = JSON.parse(JSON.stringify(minutesTable)).map(a => {
  let brother = brotherTable.find(id => id.id === a.brother_id);
  let chapter = chapterTable.find(id => id.id === a.chapter_id)
  if (brother) a.brother_id = brother.brothername
  if (chapter) a.chapter_id = chapter.name;
  return a;
})
console.log([minutesTable,newMinutesTable]);

Answer 3

I assume that you don't want to mutate objects in the original arrays with this operation.

Note You may want to handle the case where brother_id or chapter_id doesn't exist in the corresponding table. In the below example, it just sets the property value to undefined

const minutesTable = [{
  "location": "UCLA",
  "chapter_id": 2,
  "brother_id": 1,
  "created_at": "2008-05-15 22:23:00",
  "status": "Approved"
}, {
  "location": "John's Deli",
  "chapter_id": 2,
  "brother_id": 4,
  "created_at": "2008-05-15 22:23:00",
  "status": "Approved"
}]
const chapterTable = [{
  "id": 1,
  "letter_representation": "A",
  "name": "Alpha",
  "founded_at": "UCLA",
}]
const brotherTable = [{
  "id": 1,
  "profile_id": 1,
  "chapter_id": 1,
  "brothername": "Golpher",
  "firstname": "Jack",
}, {
  "id": 4,
  "profile_id": 4,
  "chapter_id": 1,
  "brothername": "Sheera",
  "firstname": "Jake",
}]

// your result
const result = minutesTable.map(m => {
  const brother = brotherTable.find(b => b.id === m.brother_id)
  const chapter = chapterTable.find(c => c.id === m.chapter_id)

  return Object.assign({}, m, {
    brother_id: brother && brother.brothername,
    chapter_id: chapter && chapter.name,
  })
})

console.log(result)