Three Ways to Reverse a String in JavaScript

Arc de Triomphe, Paris, France | Noah Rosenfield | unsplash.com

This article is based on Free Code Camp Basic Algorithm Scripting “Reverse a String”

Reversing a string is one of the most frequently asked JavaScript question in the technical round of interview. Interviewers may ask you to write different ways to reverse a string, or they may ask you to reverse a string without using in-built methods, or they may even ask you to reverse a string using recursion.

There are potentially tens of different ways to do it, excluding the built-in reverse function, as JavaScript does not have one.

Below are my three most interesting ways to solve the problem of reversing a string in JavaScript.

Algorithm Challenge

Reverse the provided string.
You may need to turn the string into an array before you can reverse it.
Your result must be a string.

Provided test cases

  • reverseString(“hello”) should become “olleh”
  • reverseString(“Howdy”) should become “ydwoH”
  • reverseString(“Greetings from Earth”) should return”htraE morf sgniteerG”

1. Reverse a String With Built-In Functions

For this solution, we will use three methods: the String.prototype.split() method, the Array.prototype.reverse() method and the Array.prototype.join() method.

  • The split() method splits a String object into an array of string by separating the string into sub strings.
  • The reverse() method reverses an array in place. The first array element becomes the last and the last becomes the first.
  • The join() method joins all elements of an array into a string.

Chaining the three methods together:

2. Reverse a String With a Decrementing For Loop

Without comments:

3. Reverse a String With Recursion

For this solution, we will use two methods: the String.prototype.substr() method and the String.prototype.charAt() method.

  • The substr() method returns the characters in a string beginning at the specified location through the specified number of characters.
"hello".substr(1); // "ello"
  • The charAt() method returns the specified character from a string.
"hello".charAt(0); // "h"

The depth of the recursion is equal to the length of the String. This solution is not the best one and will be really slow if the String is very long and the stack size is of major concern.

Without comments:

Conditional (Ternary) Operator:

Reversing a String in JavaScript is a small and simple algorithm that can be asked on a technical phone screening or a technical interview. You could take the short route in solving this problem, or take the approach by solving it with recursion or even more complex solutions.

“How to Solve FCC Algorithms” is a series of articles on the Free Code Camp Algorithm Challenges where I try to propose several solutions and explain step by step what happens behind the hood.

If you have your own solution or any suggestions, share them below in the comments.

Or you can follow me on Medium, Twitter, Github and LinkedIn, right after you click the green heart below ;-)

‪#‎StayCurious‬, ‪#‎KeepOnHacking‬ & ‪#‎MakeItHappen‬!

Resources