DEV Community 👩‍💻👨‍💻

Cover image for Getting the frequency of an element in an array in JavaScript
Perelyn-sama
Perelyn-sama

Posted on • Updated on

Getting the frequency of an element in an array in JavaScript

First of all, what is frequency?
According to Wikipedia, it's" the rate at which something occurs over a particular period of time or in a given sample."
There are multiple ways to get the frequency of an element in an array. In this article, we'll focus on one of those ways by using some of the higher-order functions in Javascript.

Let's begin

For instance, if we have an array of letters:

const letters = ["a", "b", "c", "a", "b", "c", "a", "b"];
Enter fullscreen mode Exit fullscreen mode

To get the frequency of each element, we will first need to create an empty object named count:

const count = {};
Enter fullscreen mode Exit fullscreen mode

Next, we'll utilize one those higher order functions we were talking about:

letters.forEach(e => count[e] ? count[e]++ : count[e] = 1 );
Enter fullscreen mode Exit fullscreen mode

What the above code does is simply check, if each element of letters is present in count. Initially count is empty and does not contain any of letters elements, so when the ternary operator runs on an element of letters to check if its present in count for the first time, it's going to work with the falsy condition which is to assign letters elements to 1 in the count object.
So the count object will then become:

console.log(count) // {"a" : 1, "b" : 1, "c" : 1};
Enter fullscreen mode Exit fullscreen mode

Afterward, when the ternary operator checks if count has an element of letters that has already been checked, the ternary operator will then run the truthy condition which is to increment the value of the elements in letters if they are already present in count, so count will now become:

console.log(count) // {"a" : 3, "b" : , "c" : 2};
Enter fullscreen mode Exit fullscreen mode

And just like that ladies and gentlemen, we've been able to get the frequency of each element of letters.

Conclusion

Here's the complete code:

const letters = ["a", "b", "c", "a", "b", "c", "a", "b"];
const count = {};
letters.forEach(e => count[e] ? count[e]++ : count[e] = 1 );

console.log(count) // {"a" : 1, "b" : 1, "c" : 1}
Enter fullscreen mode Exit fullscreen mode

P.S: This code can be used for both strings and numbers.

Top comments (18)

Collapse
 
kais_blog profile image
Kai

There's no need for nums.map(e => Number(e)). Here, you are transforming numbers to... well, numbers. You can skip this step. If you really want to convert them to strings you should use either String(e) or e.toString().

Collapse
 
perelynsama profile image
Perelyn-sama

I'm sorry It's a typo, I originally wanted to write String(e). Thanks for pointing out to me

Collapse
 
mzaini30 profile image
Zen

You can change Number(e) with +e

Collapse
 
keogami profile image
keogami

Thats too hacky and non intuitive i.e. not readable. As a simple rule you must avoid being clever because readable code is always better than clever code 😊

Collapse
 
perelynsama profile image
Perelyn-sama

True, simple code is good code.

Collapse
 
perelynsama profile image
Perelyn-sama

Thanks for the pointer.

Collapse
 
rishitkhandelwal profile image
Rishit Khandelwal

We could just use Array.reduce

Collapse
 
perelynsama profile image
Perelyn-sama

Yeah, there's more that one way to skin a cat

Collapse
 
rishitkhandelwal profile image
Rishit Khandelwal
const count=(i,w)=>i.reduce((a,v)=>v==w?a+1:a,0)
Enter fullscreen mode Exit fullscreen mode
Thread Thread
 
perelynsama profile image
Perelyn-sama

Thanks!

Collapse
 
bugb profile image
bugb
const letters = ["a", "b", "c", "a", "b", "c", "a", "b"];
const countLetters = letters.reduce((m,n)=>({...m, [n]:-~m[n]}),{})

// For nums, it is the same
Enter fullscreen mode Exit fullscreen mode
Collapse
 
perelynsama profile image
Perelyn-sama

Wow thanks, that's awesome and shorter

Collapse
 
bugb profile image
bugb

no problems, keep learning !

Collapse
 
bytebodger profile image
Adam Nathaniel Davis

Why would you need to do this any differently for numbers vs strings?? The first example (the one that you show as being "for string elements") works just fine if you pass in the array of numbers.

Collapse
 
perelynsama profile image
Perelyn-sama

Wow, I never realized that. Thanks for the pointer, I'll the remove the 'For numbers' part.

Collapse
 
keogami profile image
keogami

Ngl the "for numbers" part is stupid

Collapse
 
perelynsama profile image
Perelyn-sama

That I agree with, thanks for your feedback

Collapse
 
angelainniss profile image
Angela Inniss

Thanks for this. This is good for beginners like me as it says in the tags. Some of the other suggestions are cool too but a bit more confusing :)

18 Useful Github Repositories Every Developer Should Bookmark

>> Check out this classic DEV post <<