Check if an object has a key in javascript

Question

I have two arrays of objects, and I want to filter the first one according to whats on the second one. Here's an example:

var ary1 = [{id: 23, title: 'blabla'},{id:43, title: 'bleble'}, {id:54, title:'blibli'}];
var ary2 = [{id:23},{id:54}, {id:65}];

So in this case what I want to return is an array with the objects that have id's 23 and 54 of the first array, with all its possible properties (in this case, title).

Could you give me any hint that could help me?

• Josh Harrison: Please share the code of what you have tried.

Answer 1

Get a list of the indexes you want to search on using map:

var indexes = ary2.map(function (el) {
 return el.id;
});

filter the results based on the list of indexes:

var result = ary1.filter(function (el) {
 return indexes.indexOf(el.id) > -1;
});

DEMO

• Arthur Weborg: Why is this getting upvotes and my answer not? I did the exact same thing in my answer 8 minutes before this answer?
• Andy: It might be because you combined the map in the filter rather than have them as two distinct operations which makes it easier (in my mind) to understand.
• user663031: Perhaps it's because your solution redoes the map each iteration.
• Josh Harrison: @Allonsy Do note that if you still need to support IE8 (or God forbid, anything worse) you will need to use these polyfills for Array.prototype.map() and Array.prototype.filter()

Answer 2

This might help you.

1. Loop through ary2, building up an array of each id value (let's call this array existingIds).

2. After that loop, now loop through ary1. For each item in ary1, check to see if the id value exists in the existingIds array that we just built up. If it does, append the current item to a result array.

I could write the code for you, but it will be a better learning experience if you first try this yourself :)

Answer 3

Might as well make use of some functional programming built into javascript.

filteredResults = ary1.filter(function(ele){
 return (ary2.map(function(idobj){return idobj.id;}).indexOf(ele.id)>-1)
})

filter(function) will iterate through each element of an array, passing it through a callback function. From within that callback iff a true is returned, that value is kept. If false, that value is filtered out.

Also map(function) will iterate through each element of an array passing a callback value as well. All values returned from map callback will be injected into the result. So we can take the id from each element in ary2 and return it in the map function.

var ary1 = [{id: 23, title: 'blabla'},{id:43, title: 'bleble'}, {id:54, title:'blibli'}];
var ary2 = [{id:23},{id:54}, {id:65}];
//Filter for the available ID's, store the resulting objects in a new array
filteredResults = ary1.filter(function(ele){
 //map creates an array of just ID's
 return (ary2.map(function(idobj){return idobj.id;}).indexOf(ele.id)>-1)
})
//now do whatever you were planning on doing with your results/
var res = document.getElementById("results");
filteredResults.forEach(function(ele){
 res.innerHTML+="<li>{id:"+ele.id + ",title:" +ele.title+"}</li>"
})
console.log(filteredResults);

<ul id="results"></ul>

Answer 4

try this:

var ary1 = [{id: 23, title: 'blabla'},{id:43, title: 'bleble'}, {id:54, title:'blibli'}];
var ary2 = [{id:23},{id:54}, {id:65}];
var newary=[];
for(x in ary1){
 for(y in ary2){
 if(ary1[x].id == ary2[y].id){
 newary.push(ary1[x]);
 }
 }
}
console.log(newary);// here newary will be your return newary;