Build a frequency map in JavaScript
This post will discuss how to build a frequency map of a collection in JavaScript.
The frequency map is a data structure that stores the number of occurrences of each element in a collection, such as an array or a string. There are several ways to build a frequency map in JavaScript:
1. Using an object literal
If the collection is an array of numbers or strings, we can use an object literal to store the frequency map as key-value pairs, where the keys are the elements and the values are the counts. We can iterate over the collection with a for loop and increment the count of each element in the object. The following code illustrates this:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
let array = [1, 2, 3, 4, 5, 1, 2, 3]; // Create an empty object let freqMap = {}; // Iterate over the array for (let num of array) { // If the element is already in the object, increment its count // Otherwise, initialize its count to 1 freqMap[num] = freqMap[num] ? freqMap[num] + 1 : 1; } // The freqMap object contains the frequency of each element console.log(freqMap); // { '1': 2, '2': 2, '3': 2, '4': 1, '5': 1 } |
We can also iterate over the collection using a forEach() function, and increment the count for each element using the object bracket notation. We can shorten the code by using a logical OR operator (||) to provide a default value of zero if the current element is not already present in the object.
|
1 2 3 4 5 6 7 8 9 10 |
let array = [1, 2, 3, 4, 5, 1, 2, 3]; // Create an empty object let freqMap = {}; // Store the frequencies of each element in freqMap array.forEach(num => freqMap[num] = (freqMap[num] || 0) + 1); // { '1': 2, '2': 2, '3': 2, '4': 1, '5': 1 } console.log(freqMap); |
The above code creates an object with the elements as keys and their counts as values. However, this does not distinguish between different types of keys, such as 1 and "1".
2. Using a Map object
We can create a Map object to store any type of values as keys and their counts as values. We can iterate over the collection with a for…of loop and increment the count of each element in the Map. This works well for collections that contain complex objects, such as dates, maps, sets, etc. It also distinguishes between different types of keys, such as 1 and "1". The following code illustrates this:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
let array = [1, 2, 3, 4, 5, 1, 2, 3]; // Create an empty Map let freqMap = new Map(); // Iterate over the array for (let num of array) { // If the element is already in the Map, increment its count // Otherwise, initialize its count to 1 freqMap.set(num, freqMap.has(num) ? freqMap.get(num) + 1 : 1); } // freqMap contains the frequency of each element console.log(freqMap); // Map(5) { 1 => 2, 2 => 2, 3 => 2, 4 => 1, 5 => 1 } |
We can shorten the code by iterating over the collection using a forEach() function, and use a logical OR operator (||) to avoid the extra call to the has() function.
|
1 2 3 4 5 6 7 8 9 10 |
let array = [1, 2, 3, 4, 5, 1, 2, 3]; // Create an empty object let freqMap = new Map(); // Store the frequencies of each element in freqMap array.forEach(item => freqMap.set(item, (freqMap.get(item) || 0) + 1)); // { '1': 2, '2': 2, '3': 2, '4': 1, '5': 1 } console.log(freqMap); |
3. Using Array.reduce() function
The Array.reduce() function applies a function to each element of the collection and accumulates the result in an accumulator. We can use a plain object or a Map as the accumulator and update its values based on the elements. The following code illustrates this:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
let array = [1, 2, 3, 4, 5, 1, 2, 3]; // Use reduce with a Map as the accumulator let freqMap = array.reduce(function(acc, num) { // If the element is already in the Map, increment its count if (acc.has(num)) { acc.set(num, acc.get(num) + 1); } // Otherwise, initialize its count to 1 else { acc.set(num, 1); } // Return the updated accumulator return acc; // Initialize the accumulator to an empty map }, new Map()); // freqMap contains the frequency of each element console.log(freqMap); // Map(5) { 1 => 2, 2 => 2, 3 => 2, 4 => 1, 5 => 1 } |
4. Using a custom class
We can also create a custom class that extends the Map object and adds functions to add and delete elements from the frequency map. We can also adds functionality to sort and return the frequency map in different formats. This works well for collections that require more functionality and flexibility than the built-in Map object. The following code illustrates this:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
class FrequencyMap extends Map { constructor(iterable) { super(); iterable.forEach(value => this.add(value)); } add(value) { if (this.has(value)) { super.set(value, this.get(value) + 1); } else { super.set(value, 1); } return this; } // … } let array = [1, 2, 3, 4, 5, 1, 2, 3]; // freqMap contains the frequency of each element const freqMap = new FrequencyMap(array); // FrequencyMap(5) [Map] { 1 => 2, 2 => 2, 3 => 2, 4 => 1, 5 => 1 } console.log(freqMap); |
That’s all about building a frequency map of a collection in JavaScript.
Thanks for reading.
To share your code in the comments, please use our online compiler that supports C, C++, Java, Python, JavaScript, C#, PHP, and many more popular programming languages.
Like us? Refer us to your friends and support our growth. Happy coding :)