Count Array Element Occurrences in JavaScript

While working with arrays, there are some situations where the programmer needs to count the occurrences of the particular elements in an array. JavaScript offers some built-in methods to do this such as iterating the array using for loop, for-of loop, reduce() method, or the filter() method with the length property.

This article will demonstrate the methods for counting an element occurrence of the array in JavaScript.

Count Array Element Occurrences in JavaScript

To count the array element occurrences in JavaScript, use the below-given methods:

filter() method
reduce() method
for loop method

Let’s discuss all the mentioned methods separately.

Method 1: Count Array Element Occurrences Using filter() Method

To count the occurrence of the specific element in an array, the “filter()” method is used. It filtered down the given array’s elements that passed the test defined by the specified function.

Syntax
The following syntax is used for the filter() method to count the element occurrences in an array.

filter(element)

Here, the “element” is the array element currently being processed.

Return value
The elements that pass the test are returned in an array. If none of the elements meet the criteria, it returns an empty array.

Example
First, create an array of random numbers named “array”:

var array = [2, 4, 6, 4, 17, 2, 6, 17, 4, 16, 8, 2, 4, 8];

In the next step, follow these lines of code:

function elementCount(arr, element){
return arr.filter((currentElement) => currentElement == element).length;
};

In the above code snippet:

First, define a function “elementCount()” that takes two parameters, an array, and the searched element.
Then calls the “filter()” method with the “length” property that will filter the array and count the occurrences of the searched element.

Call the function “elementCount()” by passing “array” as the first argument, and the “6” is the second argument which is the searched element in an array:

console.log(elementCount(array, 6));

Output

The output indicates that the occurrence of element “6” in an array is “2”.

Method 2: Count Array Element Occurrences Using reduce() Method

The “reduce()” method is a useful method that can be utilized to efficiently calculate the number of occurrences of a specific element in an array.

Syntax
Follow the provided syntax for reduce() method:

reduce(currentValue, arr)

In the above syntax:

The “currentValue” is the current element’s value.
The “arr” is the array the current element belongs to.

Example
Define a function “elementCount()” that takes two parameters, an array and the searched element, and then calls the “reduce()” method that will count the occurrences of the searched element:

function elementCount(arr, element){
return array.reduce((currentElement, arrElement) =>
(arrElement == element ? currentElement + 1 : currentElement), 0);
};

Call the function “elementCount()” in the “console.log()” method by passing “array” as the first argument and the “2” as the second argument which is the searched element in an array:

console.log(elementCount(array, 2));

Output

The output indicates that the occurrence of element “3” in an array is “3”:

Method 3: Count Array Element Occurrences Using for Loop

There is another method for counting array element occurrences is the “for” loop. It is one of the most common methods for iterating over an array.

Syntax
Use the following syntax for the “for” loop:

for(var i = 0; i < array.length; i++) {
// statements
}

Example
Use the same array created in the previous example, now create an empty array named “elementCount”:

const elementCount = {};

In the next step, iterate the array over the length and count the occurrence of every element using the “for” loop:

for (var i = 0; i < array.length; i++) {
var element = array[i];
if (elementCount[element]) {
elementCount[element] += 1;
} else {
elementCount[element] = 1;
}
}

Print the count of the occurrences of all the elements on the console using the “console.log()” method:

console.log(elementCount);

Output

The above output shows the count of the occurrences of every element of an array.

To count the occurrence of the specific element, follow the below line of code:

console.log(elementCount[6]);

The output displays “2” which is the total count of the occurrence of element “6” in an array:

Count Array Element Occurrences Using for–of Loop

The “for-of” loop is the advanced form of the “for” loop. It is a little bit easier, and it iterates over the values of an iterable object. It is also used to count the number of total occurrences of every element in an array and a specified element.

Syntax
Follow the syntax below for the “for-of” loop:

for (var element of array) {
// statements
}

Example
Use the same array created in the previous example, now declare an empty array named “elementCount”:

const elementCount = {};

Now, use the “for-of” loop to iterate the array and count the occurrence of every element:

for (var element of array) {
if (elementCount[element]) {
elementCount[element] += 1;
} else {
elementCount[element] = 1;
}
}

Print the count of the occurrence of each element in an array on the console using the “console.log()” method:

console.log(elementCount);

The output displays the count of the occurrences of every element of an array:

To count the occurrence of the specific element, create a variable “countElement” and store “8” in it:

var countElement = 8;

Set the count to 0:

var elementCount = 0;

Iterate through the array using the for-of loop and increment the count if the “countElement” is present:

for (arr of array) {
if (arr == countElement) {
elementCount++;
}
};

Print the resultant count on the console using the “console.log()” method:

console.log(elementCount);

Output

We have compiled the methods to count the element occurrences in an array in JavaScript.

Conclusion

To count element occurrences in an array, use the “filter()” method with the “length” property, “reduce()” method, “for” loop, or the “for-of” loop. The filter() and the reduce() methods are used for counting the occurrences of the specific element, while the for loop and the for-of loop is used for both, counting all the elements’ occurrences in an array and the specific element’s occurrences in an array. This article demonstrated the methods for counting an element occurrence of the array in JavaScript.

Count Array Element Occurrences in JavaScript