# Sort an array of objects by a property in JavaScript

> Learn how to sort a JavaScript array of objects by a property value, using sort() with a callback that compares the values and returns 1 or -1 for the order.

Author: [Flavio Copes](https://flaviocopes.com/about/) | Published: 2018-12-06 | Updated: 2022-04-11 | Topics: [JavaScript](https://flaviocopes.com/tags/js/) | Canonical: https://flaviocopes.com/how-to-sort-array-of-objects-by-property-javascript/

Suppose you have an array of objects. 

You might have this problem: how do you sort this array of objects by the value of a property?

Say you have an array of objects like this:

```js
const list = [
  { color: 'white', size: 'XXL' },
  { color: 'red', size: 'XL' },
  { color: 'black', size: 'M' }
]
```

You want to render this list, but first you want to **order it by the value of one of the properties**. For example you want to order it by the color name, in alphabetical order: black, red, white.

You can use the `sort()` method of `Array`, which takes a callback function, which takes as parameters 2 objects contained in the array (which we call `a` and `b`):

```js
list.sort((a, b) => (a.color > b.color) ? 1 : -1)
```

When we return 1, the function communicates to `sort()` that the object `b` takes precedence in sorting over the object `a`. Returning `-1` would do the opposite.

The callback function could calculate other properties too, to handle the case where the color is the same, and order by a secondary property as well:

```js
list.sort((a, b) => (a.color > b.color) ? 1 : (a.color === b.color) ? ((a.size > b.size) ? 1 : -1) : -1 )
```

If you want to build a comparator like this without writing it by hand, try the [sort comparator builder](https://flaviocopes.com/tools/sort-comparator/).