Check if an array contains any element of another array in JavaScript

JavascriptArrays

Javascript Problem Overview


I have a target array ["apple","banana","orange"], and I want to check if other arrays contain any one of the target array elements.

For example:

["apple","grape"] //returns true;

["apple","banana","pineapple"] //returns true;

["grape", "pineapple"] //returns false;

How can I do it in JavaScript?

Javascript Solutions


Solution 1 - Javascript

Vanilla JS

ES2016:

const found = arr1.some(r=> arr2.includes(r))

ES6:

const found = arr1.some(r=> arr2.indexOf(r) >= 0)

How it works

some(..) checks each element of the array against a test function and returns true if any element of the array passes the test function, otherwise, it returns false. indexOf(..) >= 0 and includes(..) both return true if the given argument is present in the array.

Solution 2 - Javascript

vanilla js

/**
 * @description determine if an array contains one or more items from another array.
 * @param {array} haystack the array to search.
 * @param {array} arr the array providing items to check for in the haystack.
 * @return {boolean} true|false if haystack contains at least one item from arr.
 */
var findOne = function (haystack, arr) {
	return arr.some(function (v) {
		return haystack.indexOf(v) >= 0;
	});
};

As noted by @loganfsmyth you can shorten it in ES2016 to

/**
 * @description determine if an array contains one or more items from another array.
 * @param {array} haystack the array to search.
 * @param {array} arr the array providing items to check for in the haystack.
 * @return {boolean} true|false if haystack contains at least one item from arr.
 */
const findOne = (haystack, arr) => {
	return arr.some(v => haystack.includes(v));
};

or simply as arr.some(v => haystack.includes(v));

If you want to determine if the array has all the items from the other array, replace some() to every() or as arr.every(v => haystack.includes(v));

Solution 3 - Javascript

ES6 solution:

let arr1 = [1, 2, 3];
let arr2 = [2, 3];

let isFounded = arr1.some( ai => arr2.includes(ai) );

Unlike of it: Must contains all values.

let allFounded = arr2.every( ai => arr1.includes(ai) );

Hope, will be helpful.

Solution 4 - Javascript

If you're not opposed to using a libray, http://underscorejs.org/ has an intersection method, which can simplify this:

var _ = require('underscore');

var target = [ 'apple', 'orange', 'banana'];
var fruit2 = [ 'apple', 'orange', 'mango'];
var fruit3 = [ 'mango', 'lemon', 'pineapple'];
var fruit4 = [ 'orange', 'lemon', 'grapes'];

console.log(_.intersection(target, fruit2)); //returns [apple, orange]
console.log(_.intersection(target, fruit3)); //returns []
console.log(_.intersection(target, fruit4)); //returns [orange]

The intersection function will return a new array with the items that it matched and if not matches it returns empty array.

Solution 5 - Javascript

ES6 (fastest)

const a = ['a', 'b', 'c'];
const b = ['c', 'a', 'd'];
a.some(v=> b.indexOf(v) !== -1)

ES2016

const a = ['a', 'b', 'c'];
const b = ['c', 'a', 'd'];
a.some(v => b.includes(v));

Underscore

const a = ['a', 'b', 'c'];
const b = ['c', 'a', 'd'];
_.intersection(a, b)

DEMO: https://jsfiddle.net/r257wuv5/

jsPerf: https://jsperf.com/array-contains-any-element-of-another-array

Solution 6 - Javascript

If you don't need type coercion (because of the use of indexOf), you could try something like the following:

var arr = [1, 2, 3];
var check = [3, 4];

var found = false;
for (var i = 0; i < check.length; i++) {
    if (arr.indexOf(check[i]) > -1) {
        found = true;
        break;
    }
}
console.log(found);

Where arr contains the target items. At the end, found will show if the second array had at least one match against the target.

Of course, you can swap out numbers for anything you want to use - strings are fine, like your example.

And in my specific example, the result should be true because the second array's 3 exists in the target.


UPDATE:

Here's how I'd organize it into a function (with some minor changes from before):

var anyMatchInArray = (function () {
    "use strict";
    
    var targetArray, func;
    
    targetArray = ["apple", "banana", "orange"];
    func = function (checkerArray) {
        var found = false;
        for (var i = 0, j = checkerArray.length; !found && i < j; i++) {
            if (targetArray.indexOf(checkerArray[i]) > -1) {
                found = true;
            }
        }
        return found;
    };
    
    return func;
}());

DEMO: http://jsfiddle.net/u8Bzt/

In this case, the function could be modified to have targetArray be passed in as an argument instead of hardcoded in the closure.


UPDATE2:

While my solution above may work and be (hopefully more) readable, I believe the "better" way to handle the concept I described is to do something a little differently. The "problem" with the above solution is that the indexOf inside the loop causes the target array to be looped over completely for every item in the other array. This can easily be "fixed" by using a "lookup" (a map...a JavaScript object literal). This allows two simple loops, over each array. Here's an example:

var anyMatchInArray = function (target, toMatch) {
    "use strict";
    
    var found, targetMap, i, j, cur;
    
    found = false;
    targetMap = {};
    
    // Put all values in the `target` array into a map, where
    //  the keys are the values from the array
    for (i = 0, j = target.length; i < j; i++) {
        cur = target[i];
        targetMap[cur] = true;
    }
    
    // Loop over all items in the `toMatch` array and see if any of
    //  their values are in the map from before
    for (i = 0, j = toMatch.length; !found && (i < j); i++) {
        cur = toMatch[i];
        found = !!targetMap[cur];
        // If found, `targetMap[cur]` will return true, otherwise it
        //  will return `undefined`...that's what the `!!` is for
    }
    
    return found;
};

DEMO: http://jsfiddle.net/5Lv9v/

The downside to this solution is that only numbers and strings (and booleans) can be used (correctly), because the values are (implicitly) converted to strings and set as the keys to the lookup map. This isn't exactly good/possible/easily done for non-literal values.

Solution 7 - Javascript

Using filter/indexOf:

function containsAny(source,target)
{
    var result = source.filter(function(item){ return target.indexOf(item) > -1});   
    return (result.length > 0);  
}    


//results

var fruits = ["apple","banana","orange"];


console.log(containsAny(fruits,["apple","grape"]));

console.log(containsAny(fruits,["apple","banana","pineapple"]));

console.log(containsAny(fruits,["grape", "pineapple"]));

Solution 8 - Javascript

You could use lodash and do:

_.intersection(originalTarget, arrayToCheck).length > 0

Set intersection is done on both collections producing an array of identical elements.

Solution 9 - Javascript

const areCommonElements = (arr1, arr2) => {
    const arr2Set = new Set(arr2);
    return arr1.some(el => arr2Set.has(el));
};

Or you can even have a better performance if you first find out which of these two arrays is longer and making Set out for the longest array, while applying some method on the shortest one:

const areCommonElements = (arr1, arr2) => {
    const [shortArr, longArr] = (arr1.length < arr2.length) ? [arr1, arr2] : [arr2, arr1];
    const longArrSet = new Set(longArr);
    return shortArr.some(el => longArrSet.has(el));
};

Solution 10 - Javascript

I wrote 3 solutions. Essentially they do the same. They return true as soon as they get true. I wrote the 3 solutions just for showing 3 different way to do things. Now, it depends what you like more. You can use performance.now() to check the performance of one solution or the other. In my solutions I'm also checking which array is the biggest and which one is the smallest to make the operations more efficient.

The 3rd solution may not be the cutest but is efficient. I decided to add it because in some coding interviews you are not allowed to use built-in methods.

Lastly, sure...we can come up with a solution with 2 NESTED for loops (the brute force way) but you want to avoid that because the time complexity is bad O(n^2).

Note:

> instead of using .includes() like some other people did, you can use > .indexOf(). if you do just check if the value is bigger than 0. If > the value doesn't exist will give you -1. if it does exist, it will give you > greater than 0.

indexOf() vs includes()

Which one has better performance? indexOf() for a little bit, but includes is more readable in my opinion.

If I'm not mistaken .includes() and indexOf() use loops behind the scene, so you will be at O(n^2) when using them with .some().

USING loop

 const compareArraysWithIncludes = (arr1, arr2) => {
     const [smallArray, bigArray] =
        arr1.length < arr2.length ? [arr1, arr2] : [arr2, arr1];
    
     for (let i = 0; i < smallArray.length; i++) {
       return bigArray.includes(smallArray[i]);
     }
    
      return false;
    };

USING .some()

const compareArraysWithSome = (arr1, arr2) => {
  const [smallArray, bigArray] =
    arr1.length < arr2.length ? [arr1, arr2] : [arr2, arr1];
  return smallArray.some(c => bigArray.includes(c));
};

USING MAPS Time complexity O(2n)=>O(n)

const compararArraysUsingObjs = (arr1, arr2) => {
  const map = {};

  const [smallArray, bigArray] =
    arr1.length < arr2.length ? [arr1, arr2] : [arr2, arr1];

  for (let i = 0; i < smallArray.length; i++) {
    if (!map[smallArray[i]]) {
      map[smallArray[i]] = true;
    }
  }

  for (let i = 0; i < bigArray.length; i++) {
    if (map[bigArray[i]]) {
      return true;
    }
  }

  return false;
};

Code in my: stackblitz

I'm not an expert in performance nor BigO so if something that I said is wrong let me know.

Solution 11 - Javascript

I found this short and sweet syntax to match all or some elements between two arrays. For example

// OR operation. find if any of array2 elements exists in array1. This will return as soon as there is a first match as some method breaks when function returns TRUE

let array1 = ['a', 'b', 'c', 'd', 'e'], array2 = ['a', 'b'];

console.log(array2.some(ele => array1.includes(ele)));

// prints TRUE

// AND operation. find if all of array2 elements exists in array1. This will return as soon as there is a no first match as some method breaks when function returns TRUE

let array1 = ['a', 'b', 'c', 'd', 'e'], array2 = ['a', 'x'];

console.log(!array2.some(ele => !array1.includes(ele)));

// prints FALSE

Hope that helps someone in future!

Solution 12 - Javascript

Just one more solution

var a1 = [1, 2, 3, 4, 5]
var a2 = [2, 4]

Check if a1 contain all element of a2

var result = a1.filter(e => a2.indexOf(e) !== -1).length === a2.length
console.log(result)

Solution 13 - Javascript

What about using a combination of some/findIndex and indexOf?

So something like this:

var array1 = ["apple","banana","orange"];
var array2 = ["grape", "pineapple"];

var found = array1.some(function(v) { return array2.indexOf(v) != -1; });

To make it more readable you could add this functionality to the Array object itself.

Array.prototype.indexOfAny = function (array) {
    return this.findIndex(function(v) { return array.indexOf(v) != -1; });
}

Array.prototype.containsAny = function (array) {
    return this.indexOfAny(array) != -1;
}

Note: If you'd want to do something with a predicate you could replace the inner indexOf with another findIndex and a predicate

Solution 14 - Javascript

You can use a nested Array.prototype.some call. This has the benefit that it will bail at the first match instead of other solutions that will run through the full nested loop.

eg.

var arr = [1, 2, 3];
var match = [2, 4];

var hasMatch = arr.some(a => match.some(m => a === m));

Solution 15 - Javascript

Here is an interesting case I thought I should share.

Let's say that you have an array of objects and an array of selected filters.

let arr = [
  { id: 'x', tags: ['foo'] },
  { id: 'y', tags: ['foo', 'bar'] },
  { id: 'z', tags: ['baz'] }
];

const filters = ['foo'];

To apply the selected filters to this structure we can

if (filters.length > 0)
  arr = arr.filter(obj =>
    obj.tags.some(tag => filters.includes(tag))
  );

// [
//   { id: 'x', tags: ['foo'] },
//   { id: 'y', tags: ['foo', 'bar'] }
// ]

Solution 16 - Javascript

Adding to Array Prototype

Disclaimer: Many would strongly advise against this. The only time it'd really be a problem was if a library added a prototype function with the same name (that behaved differently) or something like that.

Code:
Array.prototype.containsAny = function(arr) {
    return this.some(
        (v) => (arr.indexOf(v) >= 0)
    )
}

Without using big arrow functions:

Array.prototype.containsAny = function(arr) {
    return this.some(function (v) {
        return arr.indexOf(v) >= 0
    })
}
Usage
var a = ["a","b"]

console.log(a.containsAny(["b","z"]))    // Outputs true

console.log(a.containsAny(["z"]))    // Outputs false

Solution 17 - Javascript

My solution applies Array.prototype.some() and Array.prototype.includes() array helpers which do their job pretty efficient as well

ES6

const originalFruits = ["apple","banana","orange"];

const fruits1 = ["apple","banana","pineapple"];

const fruits2 = ["grape", "pineapple"];

const commonFruits = (myFruitsArr, otherFruitsArr) => {
  return myFruitsArr.some(fruit => otherFruitsArr.includes(fruit))
}
console.log(commonFruits(originalFruits, fruits1)) //returns true;
console.log(commonFruits(originalFruits, fruits2)) //returns false;

Solution 18 - Javascript

It can be done by simply iterating across the main array and check whether other array contains any of the target element or not.

Try this:

function Check(A) {
    var myarr = ["apple", "banana", "orange"];
    var i, j;
    var totalmatches = 0;
    for (i = 0; i < myarr.length; i++) {
        for (j = 0; j < A.length; ++j) {
            if (myarr[i] == A[j]) {

                totalmatches++;

            }

        }
    }
    if (totalmatches > 0) {
        return true;
    } else {
        return false;
    }
}
var fruits1 = new Array("apple", "grape");
alert(Check(fruits1));

var fruits2 = new Array("apple", "banana", "pineapple");
alert(Check(fruits2));

var fruits3 = new Array("grape", "pineapple");
alert(Check(fruits3));

DEMO at JSFIDDLE

Solution 19 - Javascript

Array .filter() with a nested call to .find() will return all elements in the first array that are members of the second array. Check the length of the returned array to determine if any of the second array were in the first array.

getCommonItems(firstArray, secondArray) {
  return firstArray.filter((firstArrayItem) => {
    return secondArray.find((secondArrayItem) => {
      return firstArrayItem === secondArrayItem;
    });
  });
}

Solution 20 - Javascript

Not sure how efficient this might be in terms of performance, but this is what I use using array destructuring to keep everything nice and short:

const shareElements = (arr1, arr2) => {
  const typeArr = [...arr1, ...arr2]
  const typeSet = new Set(typeArr)
  return typeArr.length > typeSet.size
}

Since sets cannot have duplicate elements while arrays can, combining both input arrays, converting it to a set, and comparing the set size and array length would tell you if they share any elements.

Solution 21 - Javascript

When I looked at your answers, I could not find the answer I wanted. I did something myself and I want to share this with you.

It will be true only if the words entered (array) are correct.

function contains(a,b) {
    let counter = 0;
    for(var i = 0; i < b.length; i++) {;
        if(a.includes(b[i])) counter++;
    }
    if(counter === b.length) return true;
    return false;
}

let main_array = ['foo','bar','baz'];
let sub_array_a = ['foo','foobar'];
let sub_array_b = ['foo','bar'];

console.log(contains(main_array, sub_array_a)); // returns false
console.log(contains(main_array,sub_array_b )); // returns true

Solution 22 - Javascript

With underscorejs

var a1 = [1,2,3];
var a2 = [1,2];

_.every(a1, function(e){ return _.include(a2, e); } ); //=> false
_.every(a2, function(e){ return _.include(a1, e); } ); //=> true

Solution 23 - Javascript

Vanilla JS with partial matching & case insensitive

The problem with some previous approaches is that they require an exact match of every word. But, What if you want to provide results for partial matches?

function search(arrayToSearch, wordsToSearch) {
    arrayToSearch.filter(v => 
        wordsToSearch.every(w => 
            v.toLowerCase().split(" ").
                reduce((isIn, h) => isIn || String(h).indexOf(w) >= 0, false)
            )
        )
}
//Usage
var myArray = ["Attach tag", "Attaching tags", "Blah blah blah"];
var searchText = "Tag attach";
var searchArr = searchText.toLowerCase().split(" "); //["tag", "attach"]

var matches = search(myArray, searchArr);
//Will return
//["Attach tag", "Attaching tags"]

This is useful when you want to provide a search box where users type words and the results can have those words in any order, position and case.

Solution 24 - Javascript

Update @Paul Grimshaw answer, use includes insteed of indexOf for more readable >let found = arr1.some(r=> arr2.indexOf(r) >= 0)
>let found = arr1.some(r=> arr2.includes(r))

Solution 25 - Javascript

Good perfomance solution:

We should transform one of arrays to object.

const contains = (arr1, mainObj) => arr1.some(el => el in mainObj);
const includes = (arr1, mainObj) => arr1.every(el => el in mainObj);

Usage:

const mainList = ["apple", "banana", "orange"];
// We make object from array, you can use your solution to make it
const main = Object.fromEntries(mainList.map(key => [key, true]));

contains(["apple","grape"], main) // => true
contains(["apple","banana","pineapple"], main) // =>  true
contains(["grape", "pineapple"], main) // =>  false

includes(["apple", "grape"], main) // => false
includes(["banana", "apple"], main) // =>  true

> you can face with some disadvantage of checking by in operator (eg 'toString' in {} // => true), so you can change solution to obj[key] checker

Solution 26 - Javascript

I came up with a solution in node using underscore js like this:

var checkRole = _.intersection(['A','B'], ['A','B','C']);
if(!_.isEmpty(checkRole)) { 
     next();
}

Solution 27 - Javascript

Personally, I would use the following function:

var arrayContains = function(array, toMatch) {
	var arrayAsString = array.toString();
	return (arrayAsString.indexOf(','+toMatch+',') >-1);
}

The "toString()" method will always use commas to separate the values. Will only really work with primitive types.

Solution 28 - Javascript

console.log("searching Array: "+finding_array);
console.log("searching in:"+reference_array);
var check_match_counter = 0;
for (var j = finding_array.length - 1; j >= 0; j--) 
{
	if(reference_array.indexOf(finding_array[j]) > 0)
	{
		check_match_counter = check_match_counter + 1;
	}
}
 var match = (check_match_counter > 0) ? true : false;
console.log("Final result:"+match);

Solution 29 - Javascript

var target = ["apple","banana","orange"];
var checkArray = ["apple","banana","pineapple"];

var containsOneCommonItem = target.some(x => checkArray.some(y => y === x));`

["apple","grape"] //returns true;

["apple","banana","pineapple"] //returns true;

["grape", "pineapple"] //returns false;

Solution 30 - Javascript

you can do something like this

let filteredArray = array.filter((elm) => {
   for (let i=0; i<anotherAray.length; i++) {
      return elm.includes(anotherArray[i])
    }
  })

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionAlexView Question on Stackoverflow
Solution 1 - JavascriptPaul GrimshawView Answer on Stackoverflow
Solution 2 - JavascriptskyisredView Answer on Stackoverflow
Solution 3 - Javascriptprotanvir993View Answer on Stackoverflow
Solution 4 - JavascriptwillzView Answer on Stackoverflow
Solution 5 - JavascriptluskView Answer on Stackoverflow
Solution 6 - JavascriptIanView Answer on Stackoverflow
Solution 7 - JavascriptVadim GremyachevView Answer on Stackoverflow
Solution 8 - JavascriptJustin CuaresmaView Answer on Stackoverflow
Solution 9 - JavascriptAlexanderView Answer on Stackoverflow
Solution 10 - JavascriptPatricio VargasView Answer on Stackoverflow
Solution 11 - JavascriptkashpatelView Answer on Stackoverflow
Solution 12 - JavascriptCong NguyenView Answer on Stackoverflow
Solution 13 - JavascriptIt's me ... AlexView Answer on Stackoverflow
Solution 14 - JavascriptbinglesView Answer on Stackoverflow
Solution 15 - Javascriptuser5470921View Answer on Stackoverflow
Solution 16 - Javascriptcsga5000View Answer on Stackoverflow
Solution 17 - JavascriptSvyatoslav GerasimovView Answer on Stackoverflow
Solution 18 - JavascriptRitesh Kumar GuptaView Answer on Stackoverflow
Solution 19 - JavascriptNeoheuristView Answer on Stackoverflow
Solution 20 - JavascriptLuke RedmoreView Answer on Stackoverflow
Solution 21 - Javascriptuser14950961View Answer on Stackoverflow
Solution 22 - JavascriptfguillenView Answer on Stackoverflow
Solution 23 - JavascriptSntsDevView Answer on Stackoverflow
Solution 24 - JavascriptĐinh Anh HuyView Answer on Stackoverflow
Solution 25 - JavascriptzemilView Answer on Stackoverflow
Solution 26 - JavascriptcharlesView Answer on Stackoverflow
Solution 27 - JavascriptcsharpforevermoreView Answer on Stackoverflow
Solution 28 - JavascriptNaveen KotiView Answer on Stackoverflow
Solution 29 - JavascriptVasudevView Answer on Stackoverflow
Solution 30 - JavascriptPuzant BakjejianView Answer on Stackoverflow