简体   繁体   中英

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

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":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"
   }
]
Minutes Table (original array)
computed: {
    brothers () {
        return this.$store.state.brothers
    },
    chapters () {
        return this.$store.state.chapters
    },
    minutes () {
        return this.$store.getters.model
    }
},
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 } }, 

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) 

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]); 

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.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM