5 ways to reverse a string in JavaScript

2 minutes read

Writing a function to reverse a string is one of the problems you might encounter in JavaScript-related positions.

Perhaps the company you are applying for requires that you do not use methods available in JavaScript to solve problems. So let me try to find out and pocket a few ways to solve the problem above to protect yourself.

1. For loop

This is the simplest way we can think of right now. In this method we will use a descending loop to loop through each letter of the string and create a new string using the string addition method.

Another way to solve the above problem is to use a for…of loop. This is a new loop introduced in ES6. This loop has the function of looping through each element in a string or an array. Using this method seems to help your code reduce errors and tidier than the above.

function reserve(str) {
  let reversed = '';
  for (let char of str) {
    reversed = char + reversed; // Note: It must be char + reversed to receive the reverse string. You can try doing the opposite to check the results.

reverse('Hello') // Output: olleH

2. Use reverse() method

Because reversed() medthod is a method that returns the inverse order of an array and it is only used in an array, to be able to use this method to solve the problem, we need to use it with the other two methods are split() and join().

function reverse(str) {
  return str.split('').reverse().join('');

reverse('Hello') // Output: olleH

// Very fast when we use the built-in medthod is not it.
// Explain: First we will have to split the input string and convert it into an array using split (''), in split () we pass an empty string to separate each character. We then use the reverse () method to reverse the elements in the array. And finally use join ('') to join the elements in the array into a string (Similar to split (), we also pass an empty string to concatenate characters together without separating by any characters. come on).

3. Spread Operator

This is similar to the above, but it’s worth it anyway. That is, using the new Spread () operator in ES6. Spread Operator can decompose characters in a string and convert the string into an array…

Therefore, in this case we will use the Spread operator to separate the characters in the input string.

function reverse(str) {
  return [...str].reverse().join(''); // [... str] means parsing the characters in the str parameter just passed and turning it into an array. Left to do as above.
reverse('hello'); // Output: olleH

4. Reduce() method

Reduce() is a method used for arrays, so you need to use split() to split the string and convert that string into an array before you can use this method.

function reverse(str) {
  return str.split('').reduce((rev, char) => char + rev, '');
// Explain: Those who don't know about reduce() method can search gg to learn more about it. In this problem, we pass reduce() 2 para, rev takes the initial value of the array, char is the value of the current element, the single quote character to set the default value for rev is an empty string..

5. Recursion

And the last way is to use recursive method. Recursive is understood as a function that calls itself, in this problem I will use the substr () method to cut the string gradually and use access string syntax to add the cut-out character to the last string. If it is hard to imagine, just copy the code to test and run it.

function reverse(str) {
  return (str === '') ? str : reverse(str.substr(1)) + str[0];
// Explain: In this function I have to use the 3-operator (Ternary Operator) to shorten the code. If the argument is an empty string, it will return the string.If the error means that the string is valid, it will call revese () to cut the string and add it to the end of the string. So on until the original string is empty, the new string will be returned.

Good job! So we have learned 5 ways to reverse a string in JavaScript already.

Hope you learn well.

Categories: Learn programming

Keywords: ,