Check for Palindrome in JavaScript in 2 different ways – freeCodeCamp Challenge

I first joined freeCodeCamp over one year ago. I solved over 500 challenges and this is a great place to start to learn to code and especially, it’s free. But for a long time, I hadn’t visited this site regularly hence I’m now really excited to earn my very first certificate. Go through some challenges on freeCodeCamp, I’ve seen ‘check Palindrome‘ challenge, which is really popular now. So, I write this article to solve this article in two different ways in JavaScript.

First, let’s see the introduction of this challenge on freeCodeCamp:

Return true if the given string is a palindrome. Otherwise, return false.

A palindrome is a word or sentence that’s spelled the same way both forward and backward, ignoring punctuation, case, and spacing.

Note
You’ll need to remove all non-alphanumeric characters (punctuation, spaces, and symbols) and turn everything into the same case (lower or upper case) in order to check for palindromes.

We’ll pass strings with varying formats, such as "racecar""RaceCar", and "race CAR"among others.

We’ll also pass strings with special symbols, such as "2A3*3a2""2A3 3a2", and 

These are the test cases:

  • palindrome("eye")should return a boolean.palindrome("eye")should return true.
  • palindrome("_eye")should return true.palindrome("race car")should return true.
  • palindrome("not a palindrome")should return false.
  • palindrome("A man, a plan, a canal. Panama")should return true.
  • palindrome("never odd or even")should return true.
  • palindrome("nope")should return false.
  • palindrome("almostomla")should return false.palindrome("My age is 0, 0 si ega ym.")should return true.
  • palindrome("1 eye for of 1 eye.")should return false.
  • palindrome("0_0 (: /-\ :) 0-0")should return true.palindrome("five|\_/|four")should return false.

This problem is not really hard to solve, we just need to think a little bit before solving that. As the requirements of this problem (remove all non-alphanumeric characters) that is the reason why it’s better that we solve it with regular expression. But by traditional way, using for loop, we still could handle that 100% legit.

Method #1: Using for Loop

Now let’s make things simple. I will give you a guide with for loop first.

For example, we have a string: “abba” with a length of 4 and it’s a palindrome because “abba” == “abba”.

The idea:

When we already know the length of the string you want to check, implement a for loop (but where is start and where is stop?). We will break things into 2 separated parts, one for the haft first indexes and one for the last haft indexes. Loop through the first one and use if condition to check whether both are equal, then return true, false otherwise.

str = "neveroddoreven"
First index should equal the last: str[firstIndex] == str[lastIndex] (n = n);
Second index should equal the second-last: str[secondIndex] == str[secondLast] (e = e);
Third index should equal the third-last index: str[thirdIndex] == str[thirdLast] (v = v) and so on...

Pseudocode

str = "abccba"
first_half_indexes: "abc"
last_haft_indexes: "cba"
if(str[first_half_index] == str[last_haft_indexes])
   return true
else
   return false

Because “palindrome("never odd or even") should return true.” So we need to use regular expression before we get inside the for loop, we need to remove the extra spaces first then solve this problem.

Now I am sure that you know the idea how to solve this problem, here is our code:

Let’s break down what happened with this code above:

  • On the first line, we use regular expression to match all the things are NOT A-Z, a-z, 0-9, [^A-Za-a0-9] means match anything except what inside these brackets ([ ]) and after circumflex (^). Inside the brackets ([ ]) is the combination you want to search, after circumflex is the combination that you want to don’t match. In this case, we want to match all stuff like spaces, special characters, etc…If you want to learn about regular expression, forward this link to MDN.
  • On the second line, we assign our string to a new string instead, which use toLowerCase() method to lower letters and replace() method passed in 2 arguments (first is the part we want to remove, this is from line one, and second is what we want to replace after, in this case, it’s empty string “”).
  • On the third line, we use length method to get the length of the string after we convert it to a new one, see line 2.
  • On the fourth line, we implement a for loop, which loops through the first half of this string and increases each iteration by one.
  • On the fifth line, we check whether it satisfies the condition or not, str[i] are the indexes of first half string, and str[len - i - 1] are the indexes of last ones. We need to – 1 because the last element of this string is str[str.length - 1] not str[str.length] and we minus i because it will just go over the last half of this string. If any of those not satisfy the condition, we return false, otherwise true.
/* Here len/2 = 7 ("neveroddoreven".length/2) after we remove the extra space.
For each iteration:
************** i = ? i < len/2 i++ if(str[i] !== str[len - 1 - i])?
1st iteration: 0 yes 1 if(str[0] !== str[14 - 1 - 0])? => if("n" !== "n")? // false
2nd iteration: 1 yes 2 if(str[1] !== str[14 - 1 - 1])? => if("e" !== "e")? // false
3rd iteration: 2 yes 3 if(str[2] !== str[14 - 1 - 2])? => if("v" !== "v")? // false
4th iteration: 3 yes 4 if(str[3] !== str[14 - 1 - 3])? => if("e" !== "e")? // false
5th iteration: 4 yes 5 if(str[4] !== str[14 - 1 - 4])? => if("r" !== "r")? // false
6th iteration: 5 yes 6 if(str[5] !== str[14 - 1 - 5])? => if("o" !== "o")? // false
7th iteration: 6 yes 7 if(str[6] !== str[14 - 1 - 6])? => if("d" !== "d")? // false
8th iteration: 7 no
Break the loop.

palindrome("never odd or even"); // Expected output: True

Method #2: Using regular expression

So, it’s done for for loop, now let us move on solve this problem with regular expression. Actually this way it has a little more prerequisites:

If you know all of it. This problem just is a piece of cake now.

Let’s break down what happened:

  • First, likewise using for loop, we need a variable call “re” to match everything that not is A-Z, a-z, 0-9 and replace those with an empty string and make it lowers.
  • Because it’s truthy if the original string is equal to the reverse string, so we create a new variable to do that. First, we need to convert this string into an array, because reverse() method doesn’t work with string. That is when split() method comes in handy. When string is converted to an array, then we reverse this string by using reverse() method and finally we use join() method to turn this array back to the string.
  • If the reverse string equals to the original string, then return true. Otherwise false.
str.split(" ") = "neveroddoreven".split(" ") = ["n", "e", "v", "e", "r", "o", "d", "d", "o", "r", "e", "v", "e", "n"];

str.reverse() = ["n", "e", "v", "e", "r", "o", "d", "d", "o", "r", "e", "v", "e", "n"]; // it's still the same because it's a palindrome.

str.join(" ") = "neveroddoreven"; // turn it back to string after reversing.
lowerStr === reverseStr // true
"neveroddoreven" === "neveroddoreven"

Conclusion

In retrospect, I hope this article was useful and practical. We’ve learned how to check palindrome using for loop and regular expression at the same time and applied some array methods to solve this problem, if you have any further questions or recommendations about topics and articles I should do, just reply below, everyone is welcome. Once again, happy coding!

Facebook Comments

Previous Article
Next Article

Leave a Reply

avatar
  Subscribe  
Notify of

Subscribe to Our Newsletter

Categories

Archives