Last updated: Mar 6, 2024
Reading timeยท4 min
To sort an array with NULL values coming last:
sort()
method on the array, passing it a function.null
values at the end.const arr = ['c', null, 'z', null, 'b', null, 'a']; // โ Sort Ascending (low to high) const sortedAsc = arr.sort((a, b) => { if (a === null) { return 1; } if (b === null) { return -1; } if (a === b) { return 0; } return a < b ? -1 : 1; }); console.log(sortedAsc); // ๐๏ธ ['a', 'b', 'c', 'z', null, null, null]
If you need to sort an array with null
values in descending order, use the
following code sample instead.
const arr = ['c', null, 'z', null, 'b', null, 'a']; // โ Sort Descending (high to low) const sortedDesc = arr.sort((a, b) => { if (a === null) { return 1; } if (b === null) { return -1; } if (a === b) { return 0; } return a < b ? 1 : -1; }); console.log(sortedDesc); // ๐๏ธ ['z', 'c', 'b', 'a', null, null, null]
We used the Array.sort() method
to sort an array with the null
values coming last.
sort()
method sorts the elements of the array in place and returns the sorted array. In other words, it mutates the original array.const arr = ['c', null, 'z', null, 'b', null, 'a']; const sortedAsc = arr.sort((a, b) => { if (a === null) { return 1; } if (b === null) { return -1; } if (a === b) { return 0; } return a < b ? -1 : 1; }); console.log(sortedAsc); // ๐๏ธ ['a', 'b', 'c', 'z', null, null, null] // ๐๏ธ (Original array also changed) console.log(arr); // ๐๏ธ ['a', 'b', 'c', 'z', null, null, null]
If you want to sort the array without mutating it, use the spread syntax (...)
to create a shallow copy before calling the sort()
method.
const arr = ['c', null, 'z', null, 'b', null, 'a']; // ๐๏ธ create shallow copy before calling sort() const sortedAsc = [...arr].sort((a, b) => { if (a === null) { return 1; } if (b === null) { return -1; } if (a === b) { return 0; } return a < b ? -1 : 1; }); console.log(sortedAsc); // ๐๏ธ ['a', 'b', 'c', 'z', null, null, null] console.log(arr); // ๐๏ธ ['c', null, 'z', null, 'b', null, 'a']
We used the
spread syntax (...) to
unpack the values of the array into a new array before calling the sort
method.
The parameter we passed to the sort
method is a function that defines the sort
order.
const arr = ['c', null, 'z', null, 'b', null, 'a']; const sortedAsc = arr.sort((a, b) => { if (a === null) { return 1; } if (b === null) { return -1; } if (a === b) { return 0; } return a < b ? -1 : 1; }); console.log(sortedAsc); // ๐๏ธ ['a', 'b', 'c', 'z', null, null, null]
The sort()
method determines the order of the elements in the array in the
following way:
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
.
In our example, this translates to:
If a
has a value of null
, we return 1
and therefore sort b
before a
.
If b
has a value of null
, we return -1
and sort a
before b
.
If a
and b
are equal, we return 0
to keep the original order of a
and
b
.
Otherwise, we check if a
is less than b
and return -1
, else we return
1
.
All you have to do to change the order to descending is change the last line in the callback function.
const arr = ['c', null, 'z', null, 'b', null, 'a']; const sortedDesc = arr.sort((a, b) => { if (a === null) { return 1; } if (b === null) { return -1; } if (a === b) { return 0; } return a < b ? 1 : -1; }); console.log(sortedDesc); // ๐๏ธ ['z', 'c', 'b', 'a', null, null, null]
You can learn more about the related topics by checking out the following tutorials: