How to Check If JavaScript Array Contains an Element

0
11239
JavaScript Array Contains - The Complete Guide

There is no built-in array contains() function in JavaScript. But when do you need to use this approach? Well, let’s find out.

When to use contains method in JavaScript?

You should use the contains method in JavaScript to check if an array contains an element. Use the contains an approach to check whether an array includes a certain value among other elements.

JavaScript array contains

To check if an array contains an element in JavaScript, use the array includes() method. The array includes() is a built-in function that checks whether an array contains a specified element.

JavaScript includes() method restricts whether an array contains a particular element among its entries, returning true or false as appropriate.

Syntax

array.includes(element, start)

Parameters

The element is the required parameter and the element to search for.

The start is an optional parameter whose default value is 0 at which position in the array to start the search.

Return Value

The includes() method returns a boolean value.

Examples

// app.js

let dark = ['Jonas', 'Martha', 'Mikkel', 'Ulrich', 'Adam', 'Eva']
console.log(dark.includes('Adam'))

Output

true

That means Adam is there in the dark array, and it is there. Now, let’s see a condition where the item is not in the array.

// app.js

let dark = ['Jonas', 'Martha', 'Mikkel', 'Ulrich', 'Adam', 'Eva']
console.log(dark.includes('Claudia'))

Output

false

Passing the second argument

If the start parameter is greater than or equal to the array’s length, a false is returned. Therefore, the array will not be searched.

// app.js

let dark = ['Jonas', 'Martha', 'Mikkel', 'Ulrich', 'Adam', 'Eva']
console.log(dark.includes('Jonas', 6))

Output

false

In this code, the interpreter will start searching Jonas at index 6, which is not in the array, which is why it returns false. It will only count if you provide the start position; if it finds that element, it will return true.

Passing No Arguments

If you don’t pass any arguments to the includes() function, it will return false.

// app.js

let dark = ['Jonas', 'Martha', 'Mikkel', 'Ulrich', 'Adam', 'Eva']
console.log(dark.includes())

Output

false

We did not pass any argument, so it can’t understand which item we are looking for, so it will return true.

How to check if an array contains an object

There is no built-in method to check if the Javascript array contains an object with an attribute that equals a given value. So instead, we have to write our logic to check an array containing an Object.

Example

// app.js

let dark = [
  {
    name: 'Jonas',
    friend: 'Martha'
  },
  {
    name: 'Mikkel',
    friend: 'Jonas'
  },
  {
    name: 'Ulrich',
    friend: 'Katerina'
  }
]

let found = false;

for (let i = 0; i < dark.length; i++) {
  if (dark[i].name == 'Ulrich') {
    found = true;
    break;
  }
}

console.log(found)

Output

true

In this example, we defined an array containing three objects. First, we check if an array contains a specific object by comparing its value.

Without a loop, there is no “magic” way to check for something in the array. Even if you use some higher-order function, the function itself will use the loop.

You can break out of the loop as soon as you find what you’re looking for to minimize computational time.

Check if an array contains objects using filter and arrow function

We can use the combination of Javascript Higher-order functions like array.filter() and arrow function.

// app.js

let dark = [
  {
    name: 'Jonas',
    friend: 'Martha'
  },
  {
    name: 'Mikkel',
    friend: 'Jonas'
  },
  {
    name: 'Ulrich',
    friend: 'Katerina'
  }
]

let found = false;

if (dark.filter(d => d.name === 'Ulrich').length > 0) {
  found = true;
}

console.log(found)

Output

true

Here, we filter out the array whose value is Ulrich, and if the array length is > 0, that means that the array includes that item, and we will return true otherwise, we will get false.

We can also use an array.some() function. In that case, we don’t have to check the empty array condition.

// app.js

let dark = [
  {
    name: 'Jonas',
    friend: 'Martha'
  },
  {
    name: 'Mikkel',
    friend: 'Jonas'
  },
  {
    name: 'Ulrich',
    friend: 'Katerina'
  }
]

let found = false;

if (dark.some(d => d.name === 'Ulrich')) {
  found = true;
}

console.log(found)

Output

true

It will give us the same output. If the array contains an object, then it returns true otherwise false.

Javascript array contains a string

To check if Javascript contains a string, use the array indexOf() function that all arrays have (except Internet Explorer 8 and below) that will return an index of the element in the array or -1 if it’s not in the array.

JavaScript array indexOf() method searches an array for the specified element and returns its position.

The search will start at the particular position or the beginning if no start position is determined and end the search at the end of the array. It returns -1 if the item is not found.

// app.js

let dark = [
   'Jonas',
    'Mikkel',
    'Ulrich',
]

let found = false;

if (dark.indexOf('Jonas') > -1) {
  found = true;
}

console.log(found);

Output

true

Jonas is included in our array in our example, so it returns true.

Javascript array contains another array

To check if the array contains an array in Javascript, use array some() and array includes() function. The array some() method checks each element against a test method and returns true if any array item passes the test function. Otherwise, it returns false.

The indexOf() >= 0 and includes() both return true if the given argument is present in the array.

// app.js

let dark = [
   'Jonas',
    'Mikkel',
    'Ulrich',
]

let dark2 = [
  'Claudia',
  'Noah',
  'Jonas'
]

const found = dark.some(r => dark2.includes(r))
console.log(found);

Output

true

Here, we used a combination of two functions.

  1. array.some()
  2. array.includes()

It will compare every element from the dark array to the dark2 array, and if a single element is found in common, it will return true, and if both arrays are different, it will return false.

Our example, Jonas found in both arrays, is why it returns true. Let’s check the other scenario.

// app.js

let dark = [
   'Jonas',
    'Mikkel',
    'Ulrich',
]

let dark2 = [
  'Claudia',
  'Noah',
  'Adam'
]

const found = dark.some(r => dark2.includes(r))
console.log(found);

Output

false

You can see that both arrays’ elements are different, so it returns false.

Javascript array contains vs. includes

JavaScript Array.prototype.includes returns a boolean.

JavaScript Array.prototype.indexOf returns a number.

There is no Array.prototype.contains() method in native JavaScript; instead, we use the array includes() method to check if the array contains a specific element.

Array.indexOf() and String.indexOf() returns -1 on no match, the index/offset on the match. String.includes() and Array.includes() functions return a boolean true or false.

Conclusion

To check if an array contains a specific element, use the array includes() function. The includes() method returns true if an array contains an element. Otherwise, it returns false.

That’s it.

Leave A Reply

Please enter your comment!
Please enter your name here

This site uses Akismet to reduce spam. Learn how your comment data is processed.