Using Helper Functions in JavaScript

In this article, I'll be explaining how to solve the anagram algorithm using helper functions in JavaScript! Utilizing helper functions in your code makes tasks less complicated to manage and makes your code more DRY (Don't Repeat Yourself). I found them very useful when I used them to tackle algorithm problems because I noticed myself trying to solve them in just one function. After watching some tutorials and searching through hundreds of stack overflow posts to learn how to come up with easier solutions, I saw several other engineers implementing helper functions in their code which helped expand my thinking process in terms of breaking down the problem into pieces.

The anagram algorithm is one of the more simple ones out of most. Having said that, it's one of those problems that will trip you up if you don't put enough thought into your solution. If you're new to this algorithm, the goal is to implement a function that takes in two strings and checks to see if the input is an anagram. If yes, the function returns true, if no it returns false. Let's see how we can use helper functions to solve this algorithm.

Building our Character Map

We should first think about our edge cases in terms of what the user inputs to the function. What if there are spaces in the strings, or symbols in one string and not the next, or what if one string is in all caps and the other is lowercase? Also, how are we going to compare the strings if the letters are going to be out of order in both inputs? In other words, if you passed in the strings stew and west as stringA and stringB and had the condition if ('stringA' === 'stringB') it would return false because they're two different strings. To solve this we could essentially build a helper function that returns a character map of the string, and returns an object of each letter paired with a number value. The number value equals to how many times the letter appears in the string.

function buildCharacterMap(str) {
  const characterMap = {}

    for (let char of str.replace(/[^\w]/g, "").toLowerCase())
    characterMap[char] = characterMap[char] +1 || 1;

    return characterMap;
}

At the top, there's an initialized variable called characterMap set equal to an empty object. Then a for-of loop is started that iterates over every character of the passed in str and replaces any extra characters and white space using regex while also making the string lowercase. If you'd like to learn more about regex syntax please check out this cheatsheet! After that is the condition that builds our map, which sets its value to 1 or increases it if its already 1. We're halfway done with our solution!

Implementing Main Function

To write our main function, we should first convert both of the strings to character maps. If only we had a helper function that could do that for us...oh wait! We do!

function isAnagrams(stringA, stringB) {

  const stringAMap = buildCharMap(stringA)
  const stringBMap = buildCharMap(stringB)

}

Now that we have our mapped strings, we can iterate through stringAMap and compare the values from that string to stringBMap.

function isAnagrams(stringA, stringB) {

  const stringAMap = buildCharMap(stringA)
  const stringBMap = buildCharMap(stringB)

  for (let char in stringAMap) {
   if (stringAMap[char] !== stringBMap[char]) {
    return false;
  }
 }
  return true;
};

There is one more edge case we need to check before we could call our solution finished. What if our user adds an extra character by accident when inputting the strings? For example, what if they passed in 'rail' and 'rails'? Our function would still return true because both strings each have equal values for 'rail'. To fix this, we could iterate through the objects using Object.keys() and compare the length of them.

// ...
  if (Object.keys(aCharMap).length !== 
   Object.keys(bCharMap).length) {
    return false
  }

As stated, helper functions can really come in handy when you're tackling logical problems like these in the future, and its good practice to utilize them in your projects. Not only does it help you solve problems with a bit more ease and make your code less repetitive, but it shows other people reading it how you think and manage to solve tasks. I hope you enjoyed this tutorial and that it inspired you to see the beauty of helper functions!