Suggest an edit

Improve this article

Refine the answer for “What the reverse() method does”. Your changes go to moderation before they’re published.

Approval required

Content

What you’re changing

Title (EN)

Short answer (EN)

Shown above the full answer for quick recall.

Answer (EN)

**`reverse()` flips an array's element order: the first element becomes the last and the last becomes the first.** The swap happens inside that very array and the method hands back a reference to it, so it is a mutating method that will quietly damage your data if you expected a copy.

## Theory

### TL;DR
- `reverse()` reverses the order of an array's elements.
- It works in place: it changes the array it was called on.
- It returns that same array (not a copy), which makes chaining convenient.
- The safe variants are `[...arr].reverse()`, `arr.slice().reverse()` or `arr.toReversed()`.
- A string has no `reverse()`; you do `str.split('').reverse().join('')` instead.
- Complexity is O(n): the engine just swaps pairs of elements from both ends.

### Quick example
```javascript
const arr = [1, 2, 3, 4];
arr.reverse();

console.log(arr); // [4, 3, 2, 1]
```

Three facts matter here:

- the elements are rearranged **in place**, inside the original array;
- the method **mutates** the array;
- it returns **the changed array itself**, which is handy for chaining.

### Mutation and the return value
The most common trap: people write `const reversed = arr.reverse()` and believe they got a new array. In reality both variables point at one object.

```javascript
const letters = ["a", "b", "c"];
const reversed = letters.reverse();

console.log(reversed); // ["c", "b", "a"]
console.log(letters);  // ["c", "b", "a"], the very same object
```

`letters` and `reversed` are **one and the same array**, because `reverse()` returns a reference to the original object. Easy to check: `reversed === letters` is `true`.

Behaviour at a glance:

| Property | Description |
| --- | --- |
| Changes element order | Yes |
| Changes the original array | Yes |
| Returns | The same array (already reversed) |
| Type of the return value | `Array` |

### Reversing without touching the original
If you need the reversal **without changing the source array**, make a copy first:

```javascript
const arr = [1, 2, 3];
const reversed = [...arr].reverse();

console.log(arr);      // [1, 2, 3]
console.log(reversed); // [3, 2, 1]
```

Equivalent ways to copy before reversing:

```javascript
const a = arr.slice().reverse();   // classic copy
const b = Array.from(arr).reverse();
const c = arr.toReversed();        // ES2023, no manual copy needed
```

`toReversed()` returns a brand new array straight away and leaves the source alone, so in new code it is the cleanest option. Note that the copy is shallow: the order of references is reversed, but the objects inside are still shared.

```javascript
const users = [{ name: 'Alice' }, { name: 'Bob' }];
const flipped = [...users].reverse();

flipped[0].name = 'Maria';
console.log(users[1].name); // Maria, the objects are shared
```

### Strings and other structures
Strings have no `reverse()` method because they are immutable. You can still reverse one through an array of characters:

```javascript
const str = "hello";
const reversed = str.split("").reverse().join("");

console.log(reversed); // "olleh"
```

Other structures follow the same recipe, turn them into an array and reverse that:

```javascript
const set = new Set([1, 2, 3]);
const back = [...set].reverse();   // [3, 2, 1]

const list = document.querySelectorAll('li');
const lastFirst = [...list].reverse(); // NodeList has no reverse()
```

Typed arrays (`Int32Array` and friends) do have their own `reverse()`, and it mutates the buffer as well.

### The method in brief

| What it does | Reverses the order of elements |
| --- | --- |
| Mutates the array | Yes |
| Returns | The changed array (same reference) |
| Safe version | `[...arr].reverse()` or `arr.toReversed()` |
| Example | `[1,2,3].reverse()` gives `[3,2,1]` |

> **Summary:** `reverse()` puts an array's elements in the opposite order, changing the original array while doing so.

### Common mistakes
- **Treating `reverse()` as non mutating.** It is not like `map` or `filter`: after the call the source array is already reversed. If the array came from outside (props, state, a function argument), you silently corrupt someone else's data.
- **Reversing React state directly.** `state.items.reverse()` mutates the same object, so the reference does not change and no re-render happens. Use `[...state.items].reverse()` or `state.items.toReversed()`.
- **Thinking `const` protects you.** `const arr = [1,2,3]; arr.reverse();` is perfectly legal: `const` forbids reassigning the binding, not changing the array contents.
- **Confusing `reverse()` with `sort()`.** `reverse()` simply flips the existing order, it sorts nothing. For descending order sort with a comparator: `arr.sort((a, b) => b - a)`.
- **Reversing a string with emoji or other surrogate pairs via `split('')`.** That split cuts a character in half and breaks the text; `[...str].reverse().join('')` is safer because it splits by code points.
- **Expecting anything special from sparse arrays.** Empty holes are moved around too and stay holes, they do not become `undefined`.

Markdown · drag & drop images · ⌘B / ⌘I shortcuts781 words

For the reviewer

Note to the moderator (optional)

Visible only to the moderator. Helps review go faster.