基于另一个数组对数组进行排序/过滤

Question

I just posted a question here ( Sorting/Filtering from 2 arrays ) but I ran into a problem because my id's could be random strings:

so I have a master array with all the data :

var masterArray = [
        {'id' : 'wedfd', 'title' : 'Title 1'},
        {'id' : 'hji', 'title' : 'Title 2'},
        {'id' : 'sdfds', 'title' : 'Title 3'},
        {'id' : 'fgfgf', 'title' : 'Title 4'},
        {'id' : 'kkd', 'title' : 'Title 5'},
        {'id' : 'jjj', 'title' : 'Title 6'},
        {'id' : 'abc', 'title' : 'Title 7'}
    ];

I get an array with this info :

var sortFilterInfo = [
    {'id' : 'jjj', 'sortOrder' : 1},
    {'id' : 'hji', 'sortOrder' : 2},
    {'id' : 'abc', 'sortOrder' : 3}
]

With this information I need an array which gives me this sorted filtered array: ( I am only using native DOM Array methods (ES6) (map/filter/sort) and NOT Jquery,lodash, etc.

var resultArray = [
    {'id' : 'jjj', 'title' : 'Title 6', 'sortOrder' : 1},
    {'id' : 'hji', 'title' : 'Title 2', 'sortOrder' : 2},
    {'id' : 'abc', 'title' : 'Title 7', 'sortOrder' : 3}
]

Thanks!

Answer 1

You can use map() and find() ( using ES6 arrow notation )

 var masterArray = [{ 'id': 'wedfd', 'title': 'Title 1' }, { 'id': 'hji', 'title': 'Title 2' }, { 'id': 'sdfds', 'title': 'Title 3' }, { 'id': 'fgfgf', 'title': 'Title 4' }, { 'id': 'kkd', 'title': 'Title 5' }, { 'id': 'jjj', 'title': 'Title 6' }, { 'id': 'abc', 'title': 'Title 7' }]; var sortFilterInfo = [{ 'id': 'jjj', 'sortOrder': 1 }, { 'id': 'hji', 'sortOrder': 2 }, { 'id': 'abc', 'sortOrder': 3 }] // if `sortFilterInfo` is not sorted then sort it using sort() // sortFilterInfo.sort((a,b) => a.id-b.id) // iterate over `sortFilterInfo` array for generating sorted array var res = sortFilterInfo.map(v => { // get element from `masterArray` based on the id var obj = masterArray.find(v1 => v1.id == v.id); // add sortOrder to the object obj.sortOrder = v.sortOrder; // return updated object return obj; }); document.write('<pre>' + JSON.stringify(res, null, 3) + '</pre>'); 

---

Or the following with an array of id and later get the index using indexOf()

 var masterArray = [{ 'id': 'wedfd', 'title': 'Title 1' }, { 'id': 'hji', 'title': 'Title 2' }, { 'id': 'sdfds', 'title': 'Title 3' }, { 'id': 'fgfgf', 'title': 'Title 4' }, { 'id': 'kkd', 'title': 'Title 5' }, { 'id': 'jjj', 'title': 'Title 6' }, { 'id': 'abc', 'title': 'Title 7' }]; var sortFilterInfo = [{ 'id': 'jjj', 'sortOrder': 1 }, { 'id': 'hji', 'sortOrder': 2 }, { 'id': 'abc', 'sortOrder': 3 }] // if `sortFilterInfo` is not sorted then sort it using sort() // sortFilterInfo.sort((a,b) => a.id-b.id) // create an array with all id var idArr=masterArray.map(v=>v.id); // iterate over `sortFilterInfo` array for generating sorted array var res = sortFilterInfo.map(v => { // get element from `masterArray` based on the id var obj = masterArray[idArr.indexOf(v.id)]; // add sortOrder to the object obj.sortOrder = v.sortOrder; // return updated object return obj; }); document.write('<pre>' + JSON.stringify(res, null, 3) + '</pre>'); 

Answer 2

Here is a kind of brute force approach. If sortFilterInfo is in order, this solution will always work. Basically just check (lowest to highest order) if it is within the masterArray, if it is, it is guaranteed to be pushed into the correct place of the result array.

var masterArray = [
  {'id' : 'wedfd', 'title' : 'Title 1'},
  {'id' : 'hji', 'title' : 'Title 2'},
  {'id' : 'sdfds', 'title' : 'Title 3'},
  {'id' : 'fgfgf', 'title' : 'Title 4'},
  {'id' : 'kkd', 'title' : 'Title 5'},
  {'id' : 'jjj', 'title' : 'Title 6'},
  {'id' : 'abc', 'title' : 'Title 7'}
];

var sortFilterInfo = [
  {'id' : 'jjj', 'sortOrder' : 1},
  {'id' : 'hji', 'sortOrder' : 2},
  {'id' : 'abc', 'sortOrder' : 3}
];

var resultArray = [];

for(var i = 0; i < sortFilterInfo.length; i++) {
  for(var j = 0; j < masterArray.length; j++) {
    if (sortFilterInfo[i].id === masterArray[j].id) {
      resultArray.push({id : masterArray[j].id, title: masterArray[j].title, sortOrder: sortFilterInfo[i].sortOrder});
    }
  }
}