How to Reverse a String in JavaScript

Reversing a string is a common task in programming, often used in interviews or practical applications. JavaScript provides multiple ways to achieve this. This article will explore different methods to reverse a string, complete with explanations, code examples, and output for better understanding.

---

01. Using Built-In Functions

The simplest way to reverse a string in JavaScript is by combining the split(), reverse(), and join() methods.

// Function to reverse a string
function reverseString(str) {
  return str.split('').reverse().join('');
}

// Example
const input = "hello";
const reversed = reverseString(input);
console.log(reversed);

Output:

"olleh"

---

02. Using a For Loop

This method involves iterating over the string and building a new reversed string manually.

// Function to reverse a string
function reverseString(str) {
  let reversed = '';
  for (let i = str.length - 1; i >= 0; i--) {
    reversed += str[i];
  }
  return reversed;
}

// Example
const input = "world";
const reversed = reverseString(input);
console.log(reversed);

Output:

"dlrow"

---

03. Using Recursion

A recursive approach can also be used to reverse a string, making use of the function calling itself.

// Function to reverse a string using recursion
function reverseString(str) {
  if (str === "") return "";
  return reverseString(str.substr(1)) + str[0];
}

// Example
const input = "javascript";
const reversed = reverseString(input);
console.log(reversed);

Output:

"tpircsavaj"

---

04. Using Array Reduce

The reduce() method can be used on the array of characters to reverse the string.

// Function to reverse a string using reduce
function reverseString(str) {
  return str.split('').reduce((reversed, char) => char + reversed, '');
}

// Example
const input = "reduce";
const reversed = reverseString(input);
console.log(reversed);

Output:

"ecuder"

---

05. Using a Stack

A stack data structure can be simulated using an array to reverse a string.

// Function to reverse a string using a stack
function reverseString(str) {
  const stack = str.split('');
  let reversed = '';
  while (stack.length) {
    reversed += stack.pop();
  }
  return reversed;
}

// Example
const input = "stack";
const reversed = reverseString(input);
console.log(reversed);

Output:

"kcats"

---

06. Using ES6 Spread Operator

The spread operator [...str] can convert a string into an array, enabling the use of array methods.

// Function to reverse a string using spread operator
function reverseString(str) {
  return [...str].reverse().join('');
}

// Example
const input = "spread";
const reversed = reverseString(input);
console.log(reversed);

Output:

"daerps"

---

Conclusion

Reversing a string in JavaScript can be achieved through various methods, each suitable for different scenarios. Whether you prefer built-in methods like split(), reverse(), and join(), or prefer a manual approach using loops or recursion, JavaScript provides flexibility and power. Experiment with these techniques and choose the one that best fits your use case!