How to get the array value and object key values match irrespective of the order

Question

In an array of value

var legends =['some','key', 'value'];

a graph with the respective obj values;

var graph = {
  orgid: ['123', '123556', '456', '345', '2345'],
  some: [1500, 1500, 1500, 1500, 1500],
  key: [900, 900, 900, 900, 900],
  value: [1072, 1373, 946, 715, 276]
 };

I wanted to extract the graph with only key values mentioned in an array to be inserted into another array

I have executed the code but it only works if the order of the keys which are the same in the order mentioned in the obj

es5 way

var grphFilter = [];
var countRaw = 0; 
for (var key in graph) {
  if (key === legends[count] ) {
    grphFilter.push(graph[key]);
    count++;
  }
}

es6 way

let grphFilter = [];
let count = 0; 
const result = Object.entries(graph).forEach(function([key, value]) {
  if (key === legends[count]) {
    grphFilter.push(value);
    count++
  }
})

but it won't work for the keys which are not in order like.

var legendsNotOrder =['key', 'some', 'value'];

irrespective of the order of the value in the legends array, the result should be the final result, be it legends or legendsNotOrder

Final Result

var graphfiltered = [
  [1500, 1500, 1500, 1500, 1500],
  [900, 900, 900, 900, 900],
  [1072, 1373, 946, 715, 276]
];

Answer 1

You can loop through the array and get only the desired property values from object.

 var legends =['some','key', 'value']; var graph = {orgid: ['123', '123556', '456', '345', '2345'],some: [1500, 1500, 1500, 1500, 1500],key: [900, 900, 900, 900, 900],value: [1072, 1373, 946, 715, 276]}; let filteredGraph = legends.map( cur => graph[cur]) console.log(filteredGraph) //In case you have keys in legend which are not available in graph you can use below code let filteredGraph = legends.filter( cur => graph[cur]) 

Answer 2

Use Object#entries, Array#reduce, Array#includes, Array#push

 const legends=['some','key','value'];const graph={orgid:['123','123556','456','345','2345'],some:[1500,1500,1500,1500,1500],key:[900,900,900,900,900],value:[1072,1373,946,715,276]} const res = Object.entries(graph) .reduce((a,[k,v])=>{ if(legends.includes(k)) a.push(v); return a; }, []); console.log(res); 

Answer 3

You can loop on the array with the keys , then access directly the graph object. Also, you can check if key is valid before doing the push on the new array:

 var legends = ['some', 'key', 'value', 'notkey']; var graph = { orgid: ['123', '123556', '456', '345', '2345'], some: [1500, 1500, 1500, 1500, 1500], key: [900, 900, 900, 900, 900], value: [1072, 1373, 946, 715, 276] }; let graphFilter = []; legends.forEach(x => graph[x] && graphFilter.push(graph[x])); console.log(graphFilter); 

Another alternative is to combine filter() and map() on the graph's entries.

 var legends = ['some', 'key', 'value', 'notkey']; var graph = { orgid: ['123', '123556', '456', '345', '2345'], some: [1500, 1500, 1500, 1500, 1500], key: [900, 900, 900, 900, 900], value: [1072, 1373, 946, 715, 276] }; let graphFilter = Object.entries(graph) .filter(([k, v]) => legends.includes(k)) .map(([k, v]) => v); console.log(graphFilter); 

Answer 4

The problem is that you check the key at the current iteration with a specific value in the legends array. What you need to check is if the key at the current iteration is equal to any of the value of this array.

Something like:

legends.includes(key)

Here is a complete example:

 var legends = ['some', 'key', 'value']; var graph = { orgid: ['123', '123556', '456', '345', '2345'], some: [1500, 1500, 1500, 1500, 1500], key: [900, 900, 900, 900, 900], value: [1072, 1373, 946, 715, 276] }; var graphFilter = []; for (var key in graph) { if (legends.includes(key)) { graphFilter[legends.indexOf(key)] = graph[key]; } } console.log(graphFilter); 

Answer 5

ES6 One loop solution with reduce that ignores unknown keys in a legends array:

 const legends = ['some', 'key', 'value', 'random_key']; const graph = { orgid: ['123', '123556', '456', '345', '2345'], some: [1500, 1500, 1500, 1500, 1500], key: [900, 900, 900, 900, 900], value: [1072, 1373, 946, 715, 276] }; const result = legends.reduce((a, c) => { if (r = graph[c]) { a.push(r); } return a; }, []); console.log(result); 

In general, map + filter are often replaceable with reduce . The concern, the code may become more complicated. The benefit would probably be an optimisation (probably "micro"), which often is not worth it.

Please note, I replaced var with const in your original code.