Sort an Array of Strings in Descending order in JavaScript

avatar

Borislav Hadzhiev

Last updated: Jul 25, 2022

banner

Photo from Unsplash

Sort an Array of Strings in Descending order in JavaScript #

To sort an array of strings in descending order:

  1. Call the sort() method on the array.
  2. Call the reverse() method on the result.
  3. The returned array will have its elements sorted in descending order.
index.js
// ✅ Sort in Descending order const strArr1 = ['a', 'c', 'z', 'f']; const descArr = strArr1.sort().reverse(); console.log(descArr); // 👉️ ['z', 'f', 'c', 'a'] // ✅ Sort in Descending order (Alternative) const strArr2 = ['a', 'c', 'z', 'f']; const descArr2 = strArr2.sort((a, b) => (a > b ? -1 : 1)); console.log(descArr2); // 👉️ ['z', 'f', 'c', 'a'] // ✅ Sort in ascending order const strArr3 = ['z', 'c', 'a', 'f']; const ascArr = strArr3.sort(); console.log(ascArr); // 👉️ ['a', 'c', 'f', 'z']

We used the Array.sort method to sort a string array in descending order.

The sort() method sorts the elements of the array in place and returns the sorted array. In other words, it mutates the original array.
index.js
// ✅ Sort in Descending order const strArr1 = ['a', 'c', 'z', 'f']; const descArr = strArr1.sort().reverse(); console.log(descArr); // 👉️ ['z', 'f', 'c', 'a'] console.log(strArr1); // 👉️ ['z', 'f', 'c', 'a']

If you want to sort the array without mutating it, use the spread syntax (...) to create a shallow copy before calling the sort() method.

index.js
// ✅ Sort in Descending order const strArr1 = ['a', 'c', 'z', 'f']; const descArr = [...strArr1].sort().reverse(); console.log(descArr); // 👉️ ['z', 'f', 'c', 'a'] console.log(strArr1); // 👉️ ['a', 'c', 'z', 'f'] // ✅ Sort in Descending order (Alternative) const strArr2 = ['a', 'c', 'z', 'f']; const descArr2 = [...strArr2].sort((a, b) => (a > b ? -1 : 1)); console.log(descArr2); // 👉️ ['z', 'f', 'c', 'a']

We used the spread syntax (...) to unpack the values of the array into a new array before calling the sort method.

This is probably what you want to be doing since mutations can be confusing and difficult to track throughout a codebase.

The sort() and reverse() approach is probably the easiest to read of the 2 approaches in the code snippet.

index.js
// ✅ Sort in Descending order const strArr1 = ['a', 'c', 'z', 'f']; const descArr = strArr1.sort().reverse(); console.log(descArr); // 👉️ ['z', 'f', 'c', 'a']

When called without any parameters, the sort method converts the array elements to strings (if necessary) and sorts them according to their UTF-16 code unit values.

The reverse method reverses the array in place and returns the result.

index.js
// 👇️ ['c', 'b',' 'a'] console.log(['a', 'b', 'c'].reverse());

The parameter we passed to the sort method in the second example is a function that defines the sort order.

index.js
const strArr2 = ['a', 'c', 'z', 'f']; const descArr2 = [...strArr2].sort((a, b) => (a > b ? -1 : 1)); console.log(descArr2); // 👉️ ['z', 'f', 'c', 'a']
If the function parameter is not provided to the sort method, the array elements get converted to strings and sorted according to their UTF-16 code unit values.

This is not what we want when we need to sort an array of strings in descending order, however it's exactly what we want when sorting string arrays in ascending order.

If the return value of the compare function is greater than 0, then sort b before a.

If the return value of the compare function is less than 0, then sort a before b.

If the return value of the compare function is equal to 0, keep the original order of a and b.

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.
book cover
You can use the search field on my Home Page to filter through all of my articles.