How to Sort Object Array by Boolean Property in JavaScript

The admin panel that you'll actually want to use. Try for free.

November 13, 2023

Sorting an object array by a boolean property in JavaScript can be efficiently accomplished by leveraging the sort() method. This guide will demonstrate the process using clean, idiomatic examples suitable for any level of engineering expertise.

Understanding the sort method

JavaScript arrays have a built-in sort() method that allows for custom sorting logic via a comparator function. When sorting by a boolean property, this function can simply return the difference between the boolean values of two objects.

Sample object array

Consider an array of objects where each object has a boolean property named isActive.

let users = [ { name: 'Alice', isActive: false }, { name: 'Bob', isActive: true }, { name: 'Charlie', isActive: true }, { name: 'Dave', isActive: false } ];

Sorting the array

To sort by the isActive property:

users.sort((a, b) => a.isActive - b.isActive);

This will sort the array with false values first. To sort with true values first, reverse the operands:

users.sort((b, a) => a.isActive - b.isActive);

You could ship faster.

Imagine the time you'd save if you never had to build another internal tool, write a SQL report, or manage another admin panel again. Basedash is built by internal tool builders, for internal tool builders. Our mission is to change the way developers work, so you can focus on building your product.

Under the hood

The comparator function works by returning:

  • A negative number if the first argument should come before the second.
  • A positive number if the first argument should come after the second.
  • Zero if they are considered equal.

Since false is coerced to 0 and true to 1 during subtraction, this results in the correct sorting order.

Advanced sorting

For a more explicit approach, especially when dealing with TypeScript or to make the code more readable, you can use a comparison that doesn't rely on coercion:

users.sort((a, b) => { return (a.isActive === b.isActive) ? 0 : a.isActive ? -1 : 1; });

Working with TypeScript

In TypeScript, type safety adds robustness to the sorting function:

interface User { name: string; isActive: boolean; } let users: User[] = [ // ...users ]; users.sort((a, b) => Number(b.isActive) - Number(a.isActive));

This ensures that the properties exist and are of the correct type before the sort operation.

TOC

Understanding the sort method
Sample object array
Sorting the array
Under the hood
Advanced sorting
Working with TypeScript

November 13, 2023

Sorting an object array by a boolean property in JavaScript can be efficiently accomplished by leveraging the sort() method. This guide will demonstrate the process using clean, idiomatic examples suitable for any level of engineering expertise.

Understanding the sort method

JavaScript arrays have a built-in sort() method that allows for custom sorting logic via a comparator function. When sorting by a boolean property, this function can simply return the difference between the boolean values of two objects.

Sample object array

Consider an array of objects where each object has a boolean property named isActive.

let users = [ { name: 'Alice', isActive: false }, { name: 'Bob', isActive: true }, { name: 'Charlie', isActive: true }, { name: 'Dave', isActive: false } ];

Sorting the array

To sort by the isActive property:

users.sort((a, b) => a.isActive - b.isActive);

This will sort the array with false values first. To sort with true values first, reverse the operands:

users.sort((b, a) => a.isActive - b.isActive);

You could ship faster.

Imagine the time you'd save if you never had to build another internal tool, write a SQL report, or manage another admin panel again. Basedash is built by internal tool builders, for internal tool builders. Our mission is to change the way developers work, so you can focus on building your product.

Under the hood

The comparator function works by returning:

  • A negative number if the first argument should come before the second.
  • A positive number if the first argument should come after the second.
  • Zero if they are considered equal.

Since false is coerced to 0 and true to 1 during subtraction, this results in the correct sorting order.

Advanced sorting

For a more explicit approach, especially when dealing with TypeScript or to make the code more readable, you can use a comparison that doesn't rely on coercion:

users.sort((a, b) => { return (a.isActive === b.isActive) ? 0 : a.isActive ? -1 : 1; });

Working with TypeScript

In TypeScript, type safety adds robustness to the sorting function:

interface User { name: string; isActive: boolean; } let users: User[] = [ // ...users ]; users.sort((a, b) => Number(b.isActive) - Number(a.isActive));

This ensures that the properties exist and are of the correct type before the sort operation.

November 13, 2023

Sorting an object array by a boolean property in JavaScript can be efficiently accomplished by leveraging the sort() method. This guide will demonstrate the process using clean, idiomatic examples suitable for any level of engineering expertise.

Understanding the sort method

JavaScript arrays have a built-in sort() method that allows for custom sorting logic via a comparator function. When sorting by a boolean property, this function can simply return the difference between the boolean values of two objects.

Sample object array

Consider an array of objects where each object has a boolean property named isActive.

let users = [ { name: 'Alice', isActive: false }, { name: 'Bob', isActive: true }, { name: 'Charlie', isActive: true }, { name: 'Dave', isActive: false } ];

Sorting the array

To sort by the isActive property:

users.sort((a, b) => a.isActive - b.isActive);

This will sort the array with false values first. To sort with true values first, reverse the operands:

users.sort((b, a) => a.isActive - b.isActive);

You could ship faster.

Imagine the time you'd save if you never had to build another internal tool, write a SQL report, or manage another admin panel again. Basedash is built by internal tool builders, for internal tool builders. Our mission is to change the way developers work, so you can focus on building your product.

Under the hood

The comparator function works by returning:

  • A negative number if the first argument should come before the second.
  • A positive number if the first argument should come after the second.
  • Zero if they are considered equal.

Since false is coerced to 0 and true to 1 during subtraction, this results in the correct sorting order.

Advanced sorting

For a more explicit approach, especially when dealing with TypeScript or to make the code more readable, you can use a comparison that doesn't rely on coercion:

users.sort((a, b) => { return (a.isActive === b.isActive) ? 0 : a.isActive ? -1 : 1; });

Working with TypeScript

In TypeScript, type safety adds robustness to the sorting function:

interface User { name: string; isActive: boolean; } let users: User[] = [ // ...users ]; users.sort((a, b) => Number(b.isActive) - Number(a.isActive));

This ensures that the properties exist and are of the correct type before the sort operation.

What is Basedash?

What is Basedash?

What is Basedash?

Ship faster, worry less with Basedash

Ship faster, worry less with Basedash

Ship faster, worry less with Basedash

You're busy enough with product work to be weighed down building, maintaining, scoping and developing internal apps and admin panels. Forget all of that, and give your team the admin panel that you don't have to build. Launch in less time than it takes to run a standup.

You're busy enough with product work to be weighed down building, maintaining, scoping and developing internal apps and admin panels. Forget all of that, and give your team the admin panel that you don't have to build. Launch in less time than it takes to run a standup.

You're busy enough with product work to be weighed down building, maintaining, scoping and developing internal apps and admin panels. Forget all of that, and give your team the admin panel that you don't have to build. Launch in less time than it takes to run a standup.

Dashboards and charts

Edit data, create records, oversee how your product is running without the need to build or manage custom software.

USER CRM

ADMIN PANEL

SQL COMPOSER WITH AI

Screenshot of a users table in a database. The interface is very data-dense with information.