Skip to main content

How to Iterate Over an Object in Reverse Order in JavaScript

In JavaScript, standard objects ({}) maintain the insertion order of their keys (for non-integer keys). However, there is no built-in method to iterate over an object's properties in reverse order. To achieve this, you must first get an array of the object's keys, reverse that array, and then loop through it.

This guide will teach you the standard, modern method for iterating over an object in reverse using Object.keys(), Array.prototype.reverse(), and Array.prototype.forEach().

The Core Problem: Objects Don't Have a Reverse Iterator

Unlike arrays, plain JavaScript objects are not designed for ordered iteration. While modern JavaScript engines preserve the insertion order of keys, the for...in loop does not guarantee this order. More importantly, there is no built-in mechanism to start from the end and work backward.

Consider this problem:

// Problem: How to log 'c', then 'b', then 'a'?
const obj = {
a: 'one',
b: 'two',
c: 'three',
};

// A standard for...in loop goes in insertion order.
for (const key in obj) {
console.log(key);
}
// Output: 'a', 'b', 'c'

The Solution: Get Keys, Reverse, and Iterate

The correct and most reliable way to achieve a reverse loop is a three-step process:

  1. Get Keys: Use Object.keys(obj) to get an array of the object's keys in their standard insertion order.
  2. Reverse: Use the Array.prototype.reverse() method on this array to reverse it in place.
  3. Iterate: Loop over the reversed array of keys using a standard array method like forEach().

Solution:

const obj = {
a: 'one',
b: 'two',
c: 'three',
};

// 1. Get the keys: ['a', 'b', 'c']
// 2. Reverse the array: ['c', 'b', 'a']
const reversedKeys = Object.keys(obj).reverse();

console.log('Iterating in reverse order:');
// 3. Iterate over the reversed keys.
reversedKeys.forEach(key => {
const value = obj[key];
console.log(`${key}: ${value}`);
});

Output:

Iterating in reverse order:
c: three
b: two
a: one

How the Solution Works

  • Object.keys(obj): This method returns an array containing the names of the object's own enumerable string properties, in the order they were inserted. For our object, this is ['a', 'b', 'c'].
  • .reverse(): This is an array method that reverses the elements of the array in place. After this call, our reversedKeys array is ['c', 'b', 'a'].
  • .forEach(key => ...): This is a standard array method that executes a provided function once for each element in the array. In each iteration, key is 'c', then 'b', then 'a', allowing us to access the corresponding value from the original object using bracket notation (obj[key]).
note

Important Note: The reverse() method modifies the array it's called on. If you need to preserve the original order of keys for later use, you should create a copy before reversing.

const originalKeys = Object.keys(obj);
const reversedKeys = [...originalKeys].reverse(); // Create a copy with '...'

Iterating Over Values or Entries in Reverse

You can use the same pattern with Object.values() or Object.entries() if you only need the values or if you want both the key and value together in each iteration.

How to Iterate Over Values

const obj = { a: 1, b: 2, c: 3 };

const reversedValues = Object.values(obj).reverse();

console.log(reversedValues); // Output: [3, 2, 1]

How to Iterate Over Entries (Key-Value Pairs)

This is particularly elegant when combined with destructuring assignment.

const obj = { a: 1, b: 2, c: 3 };

const reversedEntries = Object.entries(obj).reverse();

reversedEntries.forEach(([key, value]) => {
console.log(`${key}: ${value}`);
});

Output:

c: 3
b: 2
a: 1

Conclusion

While JavaScript objects do not have a built-in reverse iterator, you can easily achieve this functionality by leveraging standard Object and Array methods.

  • The recommended best practice is the three-step process: Object.keys(obj).reverse().forEach(...).
  • This pattern gives you a reversed list of keys, allowing you to access the original object's properties in the desired order.
  • The same reverse() technique can be applied to the output of Object.values() or Object.entries() for different iteration needs.