How to Reverse an Array in TypeScript (With and Without Mutating)

A store manager asked me to flip an order table so the newest orders sat on top. One reverse() call did it, and then the totals chart built from the same array flipped too.

That’s because reverse() changes the array you call it on. To reverse an array in TypeScript safely, you usually want a reversed copy instead.

Quick answer: use toReversed() (ES2023 or later) or [...arr].reverse() to get a new array and keep the original:

const newestFirst = orders.toReversed();

I ran every example with TypeScript 7.0.2 and Node.js v22.22.2 in strict mode, using the same five order numbers throughout.

How does reverse() change a TypeScript array?

Here’s the sample, order numbers from oldest to newest. I reverse it and then print both variables:

const orders: number[] = [1041, 1042, 1043, 1044, 1045];

const newestFirst = orders.reverse();
console.log("newestFirst:", newestFirst);
console.log("orders:     ", orders);
console.log("same array? ", newestFirst === orders);

Output:

newestFirst: [ 1045, 1044, 1043, 1042, 1041 ]
orders:      [ 1045, 1044, 1043, 1042, 1041 ]
same array?  true

So reverse() returns the same array, not a new one. That’s fine for a local variable you own, but risky for shared data or state. Sorting arrays in TypeScript has the exact same trap with sort().

Reverse an array without mutating the original

Same order numbers, now typed as readonly so the compiler guards them. Three ways give an untouched original:

const orders: readonly number[] = [1041, 1042, 1043, 1044, 1045];

const a = orders.toReversed();          // ES2023+
const b = [...orders].reverse();
const c = orders.slice().reverse();
console.log("toReversed:", a);
console.log("spread:    ", b);
console.log("slice:     ", c);
console.log("orders:    ", orders);

Output:

toReversed: [ 1045, 1044, 1043, 1042, 1041 ]
spread:     [ 1045, 1044, 1043, 1042, 1041 ]
slice:      [ 1045, 1044, 1043, 1042, 1041 ]
orders:     [ 1041, 1042, 1043, 1044, 1045 ]

I’d pick toReversed() because it says what it does. It needs lib set to es2023 or later; on older setups, the spread copy works everywhere. More on locking arrays down in readonly arrays in TypeScript.

Reverse an array with a for loop

Interview questions and old codebases often ask for it without built-ins. A backward loop builds a copy, and a two-pointer swap flips an array in place:

const orders: number[] = [1041, 1042, 1043, 1044, 1045];

const out: number[] = [];
for (let i = orders.length - 1; i >= 0; i--) {
  out.push(orders[i]);
}
console.log("loop copy:", out);

function swapInPlace<T>(arr: T[]): T[] {
  for (let i = 0, j = arr.length - 1; i < j; i++, j--) {
    [arr[i], arr[j]] = [arr[j], arr[i]];
  }
  return arr;
}
console.log("swapped:  ", swapInPlace([...orders]));

Output:

loop copy: [ 1045, 1044, 1043, 1042, 1041 ]
swapped:   [ 1045, 1044, 1043, 1042, 1041 ]

Both print 1045 first. If you only need to read items backward, skip the copy and loop from the end; the loop styles are compared in how to loop through an array in TypeScript.

Reverse an array of objects for newest-first results

APIs often return records oldest first. Here are three orders with dates and totals, reversed for display:

interface Order { id: number; date: string; total: number }

const orders: Order[] = [
  { id: 1043, date: "2026-10-24", total: 89.5 },
  { id: 1044, date: "2026-10-26", total: 142.25 },
  { id: 1045, date: "2026-10-28", total: 37.99 },
];

const newest = orders.toReversed();
for (const o of newest) {
  console.log(o.id, o.date, `$${o.total.toFixed(2)}`);
}

newest[0].total = 0;                    // same object as orders[2]
console.log("orders[2].total:", orders[2].total);

Output:

1045 2026-10-28 $37.99
1044 2026-10-26 $142.25
1043 2026-10-24 $89.50
orders[2].total: 0

Important: toReversed() copies the array, not the objects inside it. If you’ll edit items, clone them first; see deep cloning an object in TypeScript. When the dates aren’t already in order, sort the array by date instead.

Common errors when reversing arrays in TypeScript

Calling reverse() on a readonly array doesn’t compile, since it would mutate it:

const orders: readonly number[] = [1041, 1042, 1043];

orders.reverse();

Output:

reverse_readonly.ts(3,8): error TS2339: Property 'reverse' does not exist on type 'readonly number[]'.

The fix is orders.toReversed() or [...orders].reverse(). The second error shows up when toReversed() meets an older lib setting, here es2022:

const orders: number[] = [1041, 1042, 1043];

const newest = orders.toReversed();
console.log(newest);

Output:

reverse_oldlib.ts(3,23): error TS2550: Property 'toReversed' does not exist on type 'number[]'. Do you need to change your target library? Try changing the 'lib' compiler option to 'es2023' or later.

Set "lib": ["es2023"] (or newer) in tsconfig.json, or fall back to the spread copy. Reversing text is a different job; see reversing a string in TypeScript.

Keep going with these array guides:

• Filter arrays in TypeScript
• Add elements to an array in TypeScript
• Remove an item from an array in TypeScript
• Flatten an array of arrays in TypeScript

Frequently asked questions