Reverse For Loop JavaScript

This for loop will access the items at the start of an array first. So to do a reverse for loop, we simply need to start at the end of the array, and count backwards until we reach the start of the array.

Here is the setup for a reverse array.

for( var i = arrayOfNumbers.length - 1; i >= 0; i-- ){
  console.log(arrayOfNumbers[i]);
};

So as you can see in the code above, we set the array to start with the last item in the array var i = arrayOfNumbers.length - 1;. We then make sure it stops when we reach the first element in the array i >= 0;. And finally, we have to make sure we loop backwards and not forwards as we do in a regular for loop i--.

Let's see a simple example of this.

var numsArray = [1,2,3,4,5,6,7,8,9];

for( var i = numsArray.length - 1; i >= 0; i-- ){
  console.log(numsArray[i]);
};

#Output
9
8
7
6
5
4
3
2
1

And that is how we can do a reverse array in JavaScript.

Let's see another example of this using an array of objects.

Using a Reverse For Loop in JavaScript on an Array of Objects

Let's say we have the following array of objects. Each object will have 3 properties. An id, first name, and last name.

var office_workers = [
  {id: 1, firstName: "John", lastName: "Smith"}, 
  {id: 2, firstName: "Jane", lastName: "Smith"}, 
  {id: 3, firstName: "Nicole", lastName: "Williams"}, 
  {id: 4, firstName: "Bill", lastName: "Brown"}, 
  {id: 5, firstName: "Sam", lastName: "Johnson"}
];

If we wanted to loop through this array starting at the end and target each object in the array, then we can use our reverse array code from above.

Let's see this in action below.

var office_workers = [
  {id: 1, firstName: "John", lastName: "Smith"}, 
  {id: 2, firstName: "Jane", lastName: "Smith"}, 
  {id: 3, firstName: "Nicole", lastName: "Williams"}, 
  {id: 4, firstName: "Bill", lastName: "Brown"}, 
  {id: 5, firstName: "Sam", lastName: "Johnson"}
];

for( var i=office_workers.length-1; i>=0; i-- ){
  console.log(office_workers[i]);
};

#Output
{id: 5, firstName: 'Sam', lastName: 'Johnson'}
{id: 4, firstName: 'Bill', lastName: 'Brown'}
{id: 3, firstName: 'Nicole', lastName: 'Williams'}
{id: 2, firstName: 'Jane', lastName: 'Smith'}
{id: 1, firstName: 'John', lastName: 'Smith'}

Let's say we wanted to get individual properties for each object. We simply need to target each property in our reverse for loop.

Here is how we would get the id, firstName, and lastName properties of each object.

var office_workers = [
  {id: 1, firstName: "John", lastName: "Smith"}, 
  {id: 2, firstName: "Jane", lastName: "Smith"}, 
  {id: 3, firstName: "Nicole", lastName: "Williams"}, 
  {id: 4, firstName: "Bill", lastName: "Brown"}, 
  {id: 5, firstName: "Sam", lastName: "Johnson"}
];

for( var i=office_workers.length-1; i>=0; i-- ){
  console.log(office_workers[i].id);
  console.log(office_workers[i].firstName);
  console.log(office_workers[i].lastName);
};

#Output
5
Sam
Johnson
4
Bill
Brown
3
Nicole
Williams
2
Jane
Smith
1
John
Smith

You can compare this code to a similar example in which we just use a regular for loop on this array.

Hopefully this article has been useful for you to learn how to loop through an array backwards using a reverse for loop in JavaScript.