How to reverse a string in Javascript – Fast tips

Valerio Barbera

In this article, we’ll look at three basic ways to reverse a string in JavaScript: utilizing the built-in reverse() method, a for loop, and the spread operator + reverse(). We’ll go over the advantages and disadvantages of each method and show you how to use them in your code.

Method 1: Using the reverse() function

The built-in array reverse() method is the simplest way to reverse a string in JavaScript. This method alters the original string by reversing the character order. Here’s an illustration:

let original = "Hello World";
let reversed = original.split('').reverse().join('');

console.log(reversed);

We begin by transforming the string into an array of characters using the split() method. Then we use the reverse() method to reverse the order of the characters in the array. Finally, the array is converted back into a string using join(). “dlroW olleH” is the resulting reversed string ๐Ÿ˜….

Pros

  • It can be written in one line of code.
  • It alters the original array in place, thus no new variable is needed to store the reversed array

Cons

  • It alters the original string, which can be troublesome if other sections of your code rely on the original string.

Method 2: Using a for loop

let original = "Hello World";
let reversed = "";

for (let i = original.length - 1; i >= 0; i--) {
    reversed += original[i];
}

console.log(reversed);

In this example a for loop is used to go through the original string, beginning with the final character and finishing with the first. We add the current character to the reversed string on each iteration.

Pros

  • It is a versatile approach that can be used to add intermediate manipulations during the reverse process.
  • It does not change the original string, it can be used when the original string must be retained.

Cons

  • It necessitates the use of an additional variable (reversed) to record the reversed string, which can consume additional memory.
  • When compared to the reverse() function, it takes more code to be written.

Method 3: Using the Spread Operator and reverse()

This is the same concept of the “Method 1” using the Spread Operator instead of the split() method. Here’s an example:

let original = "Hello World";
let reversed = [...original].reverse().join('');

console.log(reversedString);

Pros

  • It is a very concise way that may be accomplished with a single line of code
  • it does not change the original string, it can be used when the original string must be retained

Cons

  • This approach is incompatible with Internet Explorer or older version of other browsers. So it may not be appropriate for browsers compatibility.

You can follow me on Linkedin or X. I post about building my SaaS business.

Monitor your application for free now

I hope this article can help you make some optimization to your application.

Are you responsible for application development in your company? Consider trying my product Inspector to find out bugs and bottlenecks in your code automatically. Before your customers stumble onto the problem.

Inspector is usable by any IT leader who doesnโ€™t need anything complicated. If you want HTTP monitoring, query insights, and the ability to forward alerts and notifications into your messaging environment try Inspector for free.ย Register your account.

Or learn more on the website: https://inspector.dev

Related Posts

Neuron v3 is Here! ๐Ÿš€ Agentic Workflows in PHP

Exactly one year ago, we shared the first public lines of Neuron AI with the world. Six months ago, we stood at the crossroads of V2, refining our vision. Today, we arrive at Version 3 as the first agentic framework of the PHP world. I’m aware that a major release every six months is a

Struggling with RAG in PHP? Discover Neuron AI components

Implementing Retrieval-Augmented Generation (RAG) is often the first “wall” PHP developers hit when moving beyond simple chat scripts. While the concept of “giving an LLM access to your own data” is straightforward, the tasks required to make it work reliably in a PHP environment can be frustrating. You have to manage document parsing, vector embeddings,

Enabling Zero-UI Observability

It is getting harder to filter through the noise in our industry right now. New AI tools drop every day, and navigating the hype cycle can be exhausting. But the reality is that our day-to-day job as developers is changing. Most of us have already integrated AI agents (like Claude, Cursor, or Copilot) into our