To sort an array of objects by boolean property in JavaScript, use the sort() method and pass in a callback function that compares the two objects. The original array will be changed after using this method.
Sort An Array Of Objects By Boolean Property In JavaScript
In the example below, we have an array of objects each with a property called “active”.
var arr = [{ active: true}, { active: false}, {active: true}];We want to sort the array so that the objects with the active property set to true are first, followed by the objects with the active property set to false.
var arr = [{ active: true}, { active: false}, {active: true}];
arr.sort((a, b) => Number(b.active) – Number(a.active));
console.log(arr);Here is how the logic of the compare function works:
- If the active property of b is true and active property of a is false, the callback function will return 1, so it will sort b before a.
- If the active property of a is true and active property of b is false, the callback function will return -1, so it will sort a before b.
- If both objects have the same value for active, the callback function will return 0 and they will retain their original order in the array.
The code above will output the following:
[{
active: true
}, {
active: true
}, {
active: false
}]
If you want to sort the false values first and the true values second, you can reverse the sort order by changing the callback function to:
var arr = [{ active: true}, { active: false}, {active: true}];
arr.sort((a, b) => Number(a.active) – Number(b.active));
console.log(arr);This will output the following:
[{
active: false
}, {
active: true
}, {
active: true
}]
Note: The sort() method changes the order of the elements in an array permanently. If you want to sort the elements in an array without changing the original array, use the spread operator (…) to create a copy of the array before you sort it.
Here is how you would do that:
var arr = [{active:true}, {active:false}, {active:true}];
var sorted =
[...arr].sort((a, b) => Number(b.active – Number(a.active)));
console.log(sorted); // outputs:
// { active: true }, { active: true }, { active: false } ]
console.log(arr); // outputs:
// { active: true }, { active: false}, {active: true} ]As you can see, the original array is unchanged.
The spread operator (…) creates a shallow copy of the array, so that when you call the sort() method on the copy, the original array is not affected.
If you want to sort the false values before the true values, you can change the callback function to:
var arr = [{active:true}, {active:false}, {active:true}];
var sorted =
[...arr].sort((a, b) => Number(a.active – Number(b.active)));
console.log(sorted); // outputs:
// { active: false }, { active: true }, { active: true } ]
console.log(arr); // outputs:
// { active: true }, { active: false}, {active: true} ]Conclusion
To sort an array of objects by boolean property in JavaScript, use the sort() method and pass in a callback function that compares the two objects. The original array will be changed after using this method.
You can also use the spread operator (…) to create a copy of the array before you sort it, if you don’t want to modify the original array.