How to reverse the String in TypeScript?

This tutorial demonstrates multiple ways to reverse a string in TypeScript. At first, reversing the string problem looks easy, but what if someone asks you to explain the different approaches to reversing a string in TypeScript? For example, what if the interviewer asks to reverse the words of the string rather than reversing every character of the string?

Here, we will learn to reverse every character or word of the string in TypeScript.

Using the for-of Loop to Reverse a String in TypeScript

The naive approach to reverse the string uses the normal for loop or for-of loop. Here, we will use the for-of loop to iterate through the string as the string is iterable. After that, we can append every character of the string at the start of the reversed string.

Syntax

Here, we have given the syntax to reverse a string using the for-of loop in TypeScript.

let str = "String to reverse!"
let reverseString = "";
for (let char of str) {
   reverseString = char + reverseString;
}

Algorithm

• Step 1 − Define the string variable and initialize it with the string value.

• Step 2 − Define the reverseString variable of type string to store the reversed string and initialize it with the empty string.

• Step 3 − Use the for-of loop to iterate through every character of the string.

• Step 4 − Append every character of the string at the start of the reverseString variable.

• Step 5 − When the iteration of for loop completes, we can get the reversed string stored in the reverseString variable.

Example 1

In this example, we have simply implemented the above algorithm to reverse a string using the for-of loop. In the output, users can observe the value of the reverseString variable after the iteration of the for-of loop completes, which is reversed string.

// Defining the string variable
let str: string = "Hello Users! Reverse this string!";

// variable to store reveresd string
let reverseString: string = "";

// Iterating through the string
for (let char of str) {

   // append every character of string to the start of the reverseString
   reverseString = char + reverseString;
}
console.log("The original string is " + str);
console.log("The reversed string is " + reverseString);

On compiling, it will generate the following JavaScript code −

// Defining the string variable
var str = "Hello Users! Reverse this string!";

// variable to store reveresd string
var reverseString = "";

// Iterating through the string
for (var _i = 0, str_1 = str; _i < str_1.length; _i++) {
   var char = str_1[_i];
   // append every character of string to the start of the reverseString
   reverseString = char + reverseString;
}
console.log("The original string is " + str);
console.log("The reversed string is " + reverseString);

Output

The above code will produce the following output −

The original string is Hello Users! Reverse this string!
The reversed string is !gnirts siht esreveR !sresU olleH

Reverse Every Word of The String in TypeScript

Now, we will learn to reverse every word of the string rather than the whole string. This question is one level up from the above question, and the interviewer can ask this question rather than the above one if they want to make the interview exciting or to know your problem-solving skills.

In TypeScript, we can’t reverse the string using the reverse method. So, we will convert the string to a character array and use the reverse() method to reverse the character array. Here, we will use some built-in library methods such as split(), join(), map(), and reverse() to reverse every word of the string.

Syntax

Here, we have given the syntax to reverse every word of the string in TypeScript.

let str1: string = "Reverse the every word of this string!";
let words: Array<string> = str1.split(" ");
let reversedWords: Array<string> = words.map((word) => {
   let charArray: Array<string> = word.split("");
   charArray.reverse();
   let reversed: string = charArray.join("");
   return reversed;
});
let reverseString: string = reversedWords.join(" ");

Algorithm

• Step 1 − Use the split() method and pass the string with space as a parameter of the split() method to create the array of every word from the string.

• Step 2 − To reverse every word, use the map() method, which takes the callback function as a parameter and returns the reversed word.

• Step 3 − Inside the callback function of the map method, split the word to the character array and store it in the charArray variable.

• Step 4 − Now, reverse the charArray using the reverse() method.

• Step 5 − Next, join the charaArray using the join() method, and store the resultant string in the reversed variable.

• Step 6 − Return the reversed variable which contains the reversed word.

• Step 7 − The reverseWords variable contains the array of reversed words; to make it one string, use the join() method.

Example 2

In the example below, we have taken a string and reversed every word of the string by applying the above algorithm. In the output, we can observe that our algorithm reverses the separate words rather than reversing the whole string.

// String to reverse every word
let str1: string = "Reverse the every word of this string!";

// split string into words
let words: Array<string> = str1.split(" ");

// reverse every word of the words array
let reversedWords: Array<string> = words.map((word) => {

   // split the word into an array of character
   let charArray: Array<string> = word.split("");
   
   // reverse the character array
   charArray.reverse();
   
   // join the character array to make it word again
   let reversed: string = charArray.join("");
   
   // return the reversed word
   return reversed;
});
// join the array of words to make it one string
let reverseString: string = reversedWords.join(" ");
console.log("The normal string is " + str1);
console.log("The string after reversing the every word is " + reverseString);

On compiling, it will generate the following JavaScript code:

// String to reverse every word
var str1 = "Reverse the every word of this string!";

// split string into words
var words = str1.split(" ");

// reverse every word of the words array
var reversedWords = words.map(function (word) {

   // split the word into an array of character
   var charArray = word.split("");
   
   // reverse the character array
   charArray.reverse();
   
   // join the character array to make it word again
   var reversed = charArray.join("");
   
   // return the reversed word
   return reversed;
});
// join the array of words to make it one string
var reverseString = reversedWords.join(" ");
console.log("The normal string is " + str1);
console.log("The string after reversing the every word is " + reverseString);

Output

The above code will produce the following output −

The normal string is Reverse the every word of this string!
The string after reversing the every word is esreveR eht yreve drow fo siht !gnirts

Users learned the naive approach to reverse the string using the for-of loop in this tutorial. Users also learned to reverse every word of the string. However, they can also implement the second approach to reverse the string using the for-of loop rather than the built-in methods.