By Tyrone Slothrop


2009-07-15 03:17:47 8 Comments

I have an array of JavaScript objects:

var objs = [ 
    { first_nom: 'Lazslo', last_nom: 'Jamf'     },
    { first_nom: 'Pig',    last_nom: 'Bodine'   },
    { first_nom: 'Pirate', last_nom: 'Prentice' }
];

How can I sort them by the value of last_nom in JavaScript?

I know about sort(a,b), but that only seems to work on strings and numbers. Do I need to add a toString() method to my objects?

30 comments

@Patrick Roberts 2018-07-18 09:53:13

I haven't seen this particular approach suggested, so here's a terse comparison method I like to use that works for both string and number types:

const objs = [ 
  { first_nom: 'Lazslo', last_nom: 'Jamf'     },
  { first_nom: 'Pig',    last_nom: 'Bodine'   },
  { first_nom: 'Pirate', last_nom: 'Prentice' }
];

const sortBy = fn => {
  const cmp = (a, b) => -(a < b) || +(a > b);
  return (a, b) => cmp(fn(a), fn(b));
};

const getLastName = o => o.last_nom;
const sortByLastName = sortBy(getLastName);

objs.sort(sortByLastName);
console.log(objs.map(getLastName));

Explanation of sortBy()

sortBy() accepts a fn that selects a value from an object to use in comparison, and returns a function that can be passed to Array.prototype.sort(). In this example, we're comparing o.last_nom. Whenever we receive two objects such as

a = { first_nom: 'Lazslo', last_nom: 'Jamf' }
b = { first_nom: 'Pig', last_nom: 'Bodine' }

we compare them with (a, b) => cmp(fn(a), fn(b)). Given that

fn = o => o.last_nom

we can expand the comparison function to (a, b) => cmp(a.last_nom, b.last_nom). Because of the way logical OR (||) works in JavaScript, cmp(a.last_nom, b.last_nom) is equivalent to

if (a.last_nom < b.last_nom) return -1;
if (a.last_nom > b.last_nom) return 1;
return 0;

Incidentally, this is called the three-way comparison "spaceship" (<=>) operator in other languages.

Finally, here's the ES5-compatible syntax without using arrow functions:

var objs = [ 
  { first_nom: 'Lazslo', last_nom: 'Jamf'     },
  { first_nom: 'Pig',    last_nom: 'Bodine'   },
  { first_nom: 'Pirate', last_nom: 'Prentice' }
];

function sortBy(fn) {
  function cmp(a, b) { return -(a < b) || +(a > b); }
  return function (a, b) { return cmp(fn(a), fn(b)); };
}

function getLastName(o) { return o.last_nom; }
var sortByLastName = sortBy(getLastName);

objs.sort(sortByLastName);
console.log(objs.map(getLastName));

@MSOACC 2020-07-09 11:02:11

I like this approach but I think using the shorthand of -(fa < fb) || +(fa > fb) is a mistake here. That's multiple statements being condensed into one line of code. The alternative, written with an if statement, would be much more readable whilst still being fairly concise. I think it's a mistake to sacrifice readability for prettiness.

@Patrick Roberts 2020-07-09 14:55:14

@MSOACC thanks for your opinion but I respectfully disagree. Other languages implement a three-way comparison operator that performs the same comparison, so just think of it conceptually as fa <=> fb.

@Kamil Kiełczewski 2020-06-10 18:04:55

Deep

Based on this excellent tutorial I would like to develop Vlad Bezden answer and explain why localeCompare is better than standard comarison method like strA > strB. Lets run this example

console.log( 'Österreich' > 'Zealand' );  // We expect false
console.log( 'a' > 'Z' );                 // We expect false

The reason is that in JS all strings are encoded using UTF-16 and

let str = '';

// order of characters in JS
for (let i = 65; i <= 220; i++) {
  str += String.fromCodePoint(i); // code to character
}

console.log(str);

Capital letters go first (have small codes) and then go small letters and then go character Ö (after z). This is reason why we get true in first snippet - becasue operator > compare characters codes.

As you can see compare characters in diffrent languages is non trivial task - but luckily, modern browsers support the internationalization standard ECMA-402. So in JS we have strA.localeCompare(strB) which do the job (-1 means strA is less than strB; 1 means opposite; 0 means equal)

console.log( 'Österreich'.localeCompare('Zealand') ); // We expect -1
console.log( 'a'.localeCompare('Z') );                // We expect -1

I would like to add that localeCompare supports two parameters: language and additional rules

var objs = [ 
    { first_nom: 'Lazslo', last_nom: 'Jamf'     },
    { first_nom: 'Pig',    last_nom: 'Bodine'   },
    { first_nom: 'Pirate', last_nom: 'Prentice' },
    { first_nom: 'Test',   last_nom: 'jamf'     } 
];

objs.sort((a,b)=> a.last_nom.localeCompare(b.last_nom,'en',{sensitivity:'case'}))

console.log(objs);

// in '>' comparison 'Jamf' will NOT be next to 'jamf'

@a8m 2016-11-06 13:18:26

I know this question is too old, but I didn't see any implementation similar to mine.
This version is based on the Schwartzian transform idiom.

function sortByAttribute(array, ...attrs) {
  // generate an array of predicate-objects contains
  // property getter, and descending indicator
  let predicates = attrs.map(pred => {
    let descending = pred.charAt(0) === '-' ? -1 : 1;
    pred = pred.replace(/^-/, '');
    return {
      getter: o => o[pred],
      descend: descending
    };
  });
  // schwartzian transform idiom implementation. aka: "decorate-sort-undecorate"
  return array.map(item => {
    return {
      src: item,
      compareValues: predicates.map(predicate => predicate.getter(item))
    };
  })
  .sort((o1, o2) => {
    let i = -1, result = 0;
    while (++i < predicates.length) {
      if (o1.compareValues[i] < o2.compareValues[i]) result = -1;
      if (o1.compareValues[i] > o2.compareValues[i]) result = 1;
      if (result *= predicates[i].descend) break;
    }
    return result;
  })
  .map(item => item.src);
}

Here's an example how to use it:

let games = [
  { name: 'Mashraki',          rating: 4.21 },
  { name: 'Hill Climb Racing', rating: 3.88 },
  { name: 'Angry Birds Space', rating: 3.88 },
  { name: 'Badland',           rating: 4.33 }
];

// sort by one attribute
console.log(sortByAttribute(games, 'name'));
// sort by mupltiple attributes
console.log(sortByAttribute(games, '-rating', 'name'));

@Nur 2020-04-08 20:29:08

You can use a reusable sort function rather than sort(method) much like functional programing.

Array.prototype.order= function(prop, methods = {}) {
  let swipe = 1;
  if (prop && prop.constructor === Object) methods = prop;
  swipe = methods.reverse ? -1 : 1;
  function key(x) {
    if (typeof prop === "string")
      return methods.insensitive ? String(x[prop]).toLowerCase() : x[prop];
    if (methods.insensitive) return String(x).toLowerCase();
    return x;
  }
  this.sort((a, b) => {
    if (key(a) < key(b)) return -1 * swipe;
    if (key(b) < key(a)) return 1 * swipe;
    return 0;
  });
  return this;
};

Its can be use to sort both Array and Object in array
.

let arr = [6, 2, 4, 1, 5, 3];
let arr2 = [
  { name: "Bar", age: 12 },
  { name: "Nur", age: 18 },
  { name: "foo", age: 30 },
  { name: "bazz", age: 15 }
];
arr.order({ reverse: true }); //  [ 6, 5, 4, 3, 2, 1 ]
arr2.order("name", { reverse: 1, insensitive: 0});
let arr3 = [...arr2].order("age");  // new sorted array created from arr2 (But does not change original array)

1nd (optional) > to sort object contain in array.
2rd is method > { reverse: Boolean, insensitive: Boolean }

@Nico Van Belle 2017-08-30 14:15:44

Lodash.js (superset of Underscore.js)

It's good not to add a framework for every simple piece of logic, but relying on well tested utility frameworks can speed up development and reduce the amount of bugs.

Lodash produces very clean code and promotes a more functional programming style. In one glimpse it becomes clear what the intent of the code is.

OP's issue can simply be solved as:

const sortedObjs = _.sortBy(objs, 'last_nom');

More info? E.g. we have following nested object:

const users = [
  { 'user': {'name':'fred', 'age': 48}},
  { 'user': {'name':'barney', 'age': 36 }},
  { 'user': {'name':'wilma'}},
  { 'user': {'name':'betty', 'age': 32}}
];

We now can use the _.property shorthand user.age to specify the path to the property that should be matched. We will sort the user objects by the nested age property. Yes, it allows for nested property matching!

const sortedObjs = _.sortBy(users, ['user.age']);

Want it reversed? No problem. Use _.reverse.

const sortedObjs = _.reverse(_.sortBy(users, ['user.age']));

Want to combine both using chain?

const { chain } = require('lodash');
const sortedObjs = chain(users).sortBy('user.age').reverse().value();

Or when do you prefer flow over chain

const { flow, reverse, sortBy } = require('lodash/fp');
const sortedObjs = flow([sortBy('user.age'), reverse])(users); 

@Abhishek 2020-03-03 08:50:27

Try this,

UPTO ES5

//Ascending Sort
items.sort(function (a, b) {
   return a.value - b.value;
});


//Descending Sort
items.sort(function (a, b) {
   return b.value - a.value;
});


IN ES6 & above:

// Ascending sort
items.sort((a, b) => a.value - b.value);

// Descending Sort
 items.sort((a, b) => b.value - a.value);

@Omar Hasan 2020-03-16 09:21:31

best and easy solution

@Damjan Pavlica 2017-10-20 12:10:40

Old answer that is not correct:

arr.sort((a, b) => a.name > b.name)

UPDATE

From Beauchamp's comment:

arr.sort((a, b) => a.name < b.name ? -1 : (a.name > b.name ? 1 : 0))

More readable format:

arr.sort((a, b) => {
  if (a.name < b.name) return -1
  return a.name > b.name ? 1 : 0
})

Without nested ternaries:

arr.sort((a, b) => a.name < b.name ? - 1 : Number(a.name > b.name))

Explanation: Number() will cast true to 1 and false to 0.

@TitanFighter 2018-02-03 19:55:05

It works, but the result is unstable for some reason

@Patrick Roberts 2018-07-18 09:23:04

@AO17 no it won't. You can't subtract strings.

@Jean-François Beauchamp 2018-08-29 15:33:21

This should do it: arr.sort((a, b) => a.name < b.name ? -1 : (a.name > b.name ? 1 : 0))

@Ahsan 2019-01-22 13:49:26

@Jean-FrançoisBeauchamp, your solution works perfectly fine and much better.

@Kojo 2020-01-15 16:43:59

the 3rd one with Number is straightforward and nice !

@cbdeveloper 2019-12-20 09:49:07

This is my take on this:

The order parameter is optional and defaults to "ASC" for ascending order.

function sortByProperty(array,property,order="ASC") {
  return array.sort((a,b) => order === "ASC" ?
    a[property] > b[property] ? 1 : a[property] < b[property] ? -1 : 0
  : a[property] > b[property] ? -1 : a[property] < b[property] ? 1 : 0
  );
}

SNIPPET

function sortByProperty(array,property,order="ASC") {
  return array.sort((a,b) => order === "ASC" ?
    a[property] > b[property] ? 1 : a[property] < b[property] ? -1 : 0
  : a[property] > b[property] ? -1 : a[property] < b[property] ? 1 : 0
  );
}

const rockStars = [
  { name: "Axl",
    lastname: "Rose" },
  { name: "Elthon",
    lastname: "John" },
  { name: "Paul",
    lastname: "McCartney" },
  { name: "Lou",
    lastname: "Reed" }
];

sortByProperty(rockStars,"name");

console.log("Ordered by name A-Z:");
rockStars.forEach((item) => console.log(item.name + " " + item.lastname));

sortByProperty(rockStars,"lastname","DESC");

console.log("\nOrdered by lastname Z-A:");
rockStars.forEach((item) => console.log(item.lastname + ", " + item.name));

@SwiftNinjaPro 2019-11-25 02:03:38

Hers a function you can use to sort the list by multiple objects, where if the first object is equal, the second order will be used as a fallback. empty values should also be ignored to fallback order if possible.

function sortObjects(list, orderBy){
    list.sort(function(a, b){
        let byIndex = 0;
        let order = orderBy[byIndex];
        while(!a[order.by] || !b[order.by] || a[order.by] === b[order.by]){
            byIndex++;
            if(byIndex >= orderBy.length){break;}
            order = orderBy[byIndex];
        }
        if(!a[order.by] || !b[order.by] || a[order.by] === b[order.by]){
            return false;
        }
        if(order.desc){
            return a[order.by] < b[order.by];
        }
        return a[order.by] > b[order.by];
    });
    return list;
}

usage:

var objs = [
    {a: 10, b: 20, c: 30},
    {a: 30, b: 10, c: 20},
    {a: 20, b: 10, c: 30},
];

sortObjectList(objs, [{by: 'a'}]);
[
    {a: 10, b: 20, c: 30},
    {a: 20, b: 10, c: 30},
    {a: 30, b: 10, c: 20},
]

sortObjectList(objs, [{by: 'a', desc: true}]);
[
    {a: 30, b: 10, c: 20},
    {a: 20, b: 10, c: 30},
    {a: 10, b: 20, c: 30},
]

sortObjectList(objs, [{by: 'b', desc: true}, {by: 'c'}]);
[
    {a: 10, b: 20, c: 30},
    {a: 30, b: 10, c: 20},
    {a: 20, b: 10, c: 30},
]

another example:

var objs = [
    {a: 5, b: 5},
    {a: 10, b: 15},
    {a: 15, b: 25},
    {b: 10},
    {b: 20},
    {a: 10, b: 30},
    {a: 10, b: 12},
];

sortObjectList(objs, [{by: 'a'}, {by: 'b'}]);
[
    {a: 5, b: 5},
    {b: 10},
    {a: 10, b: 12},
    {a: 10, b: 15},
    {b: 20},
    {a: 10, b: 30},
    {a: 15, b: 25},
]

@Jadli 2019-11-19 11:15:33

this sorting funciton can be use for all object sorting,

  • object

  • deepObject

  • numeric array

you can also do assending or desending sort by passing 1,-1 as param

Object.defineProperty(Object.prototype, 'deepVal', {
    enumerable: false,
    writable: true,
    value: function (propertyChain) {
        var levels = propertyChain.split('.');
        parent = this;
        for (var i = 0; i < levels.length; i++) {
            if (!parent[levels[i]])
                return undefined;
            parent = parent[levels[i]];
        }
        return parent;
    }
});


function dynamicSortAll(property,sortOrders=1) {

/**default sorting will be ascending order if you need descending order
sording you have to pass -1 as param**/

    var sortOrder = sortOrders;
   
    return function (a,b) {

		 var result =(property? ((a.deepVal(property) > b.deepVal(property)) ? 1 : (a.deepVal(property) < b.deepVal(property)) ? -1 : 0) :((a > b) ? 1 : (a < b) ? -1 : 0))
		
        return result * sortOrder;
		
   
    }
}

deepObj = [
    {
        a: { a: 1, b: 2, c: 3 },
        b: { a: 4, b: 5, c: 6 }
    },
    { 
        a: { a: 3, b: 2, c: 1 },
        b: { a: 6, b: 5, c: 4 }
}];

let deepobjResult=deepObj.sort(dynamicSortAll('a.a',1))
console.log('deepobjResult :'+ JSON.stringify(deepobjResult))
var obj = [ 
    { first_nom: 'Lazslo', last_nom: 'Jamf'     },
    { first_nom: 'Pig',    last_nom: 'Bodine'   },
    { first_nom: 'Pirate', last_nom: 'Prentice' }
];
let objResult=obj.sort(dynamicSortAll('last_nom',1))
console.log('objResult :'+ JSON.stringify(objResult))

var numericObj=[1,2,3,4,5,6]

let numResult=numericObj.sort(dynamicSortAll(null,-1))
console.log('numResult :'+ JSON.stringify(numResult))

let stringSortResult='helloworld'.split('').sort(dynamicSortAll(null,1))

 console.log('stringSortResult:'+ JSON.stringify(stringSortResult))

let uniqueStringOrger=[...new Set(stringSortResult)]; 
 console.log('uniqueStringOrger:'+ JSON.stringify(uniqueStringOrger))

@Vlad Bezden 2016-01-29 19:44:37

In ES6/ES2015 or later you can do this way:

objs.sort((a, b) => a.last_nom.localeCompare(b.last_nom));

Prior to ES6/ES2015

objs.sort(function(a, b) {
    return a.last_nom.localeCompare(b.last_nom)
});

@Jon Harding 2016-02-22 20:30:59

this has been available since JS 1.1, the fat arrow piece to this is the ES6/2015 piece. But still very useful, and best answer in my opinion

@Vlad Bezden 2016-05-26 18:24:21

@PratikKelwalkar: if you need reverse it just switch a and b comparison: objs.sort((a, b) => b.last_nom.localeCompare(a.last_nom));

@and-bri 2017-05-29 18:15:52

is it possible to use a index as well to address the field for sorting: instead of last_nom use just the number in the array: 1 ?

@scipper 2018-01-09 08:49:39

@VladBezden thanks for your answer! This solution is the first with very small programmatic effort and correct sorting results and a string array like: ["Name1", "Name10", "Name2", "something else", "Name11"]. I got sorting to work correctly with objs.sort((a, b) => a.last_nom.localeCompare(b.last_nom, undefined, {numberic: true}));

@Sebastian Patten 2019-05-23 05:05:58

To do this with numbers descending: .sort((a, b) => b.numberProperty - a.numberProperty). Ascending: .sort((a, b) => a.numberProperty - b.numberProperty)

@Falke Design 2020-04-03 09:16:24

Also working with integers when converting to string: a.id.toString().localeCompare(b.id.toString(), undefined, {numberic: true})

@Ege Özcan 2011-01-21 15:03:06

You can also create a dynamic sort function that sorts objects by their value that you pass:

function dynamicSort(property) {
    var sortOrder = 1;
    if(property[0] === "-") {
        sortOrder = -1;
        property = property.substr(1);
    }
    return function (a,b) {
        /* next line works with strings and numbers, 
         * and you may want to customize it to your needs
         */
        var result = (a[property] < b[property]) ? -1 : (a[property] > b[property]) ? 1 : 0;
        return result * sortOrder;
    }
}

So you can have an array of objects like this:

var People = [
    {Name: "Name", Surname: "Surname"},
    {Name:"AAA", Surname:"ZZZ"},
    {Name: "Name", Surname: "AAA"}
];

...and it will work when you do:

People.sort(dynamicSort("Name"));
People.sort(dynamicSort("Surname"));
People.sort(dynamicSort("-Surname"));

Actually this already answers the question. Below part is written because many people contacted me, complaining that it doesn't work with multiple parameters.

Multiple Parameters

You can use the function below to generate sort functions with multiple sort parameters.

function dynamicSortMultiple() {
    /*
     * save the arguments object as it will be overwritten
     * note that arguments object is an array-like object
     * consisting of the names of the properties to sort by
     */
    var props = arguments;
    return function (obj1, obj2) {
        var i = 0, result = 0, numberOfProperties = props.length;
        /* try getting a different result from 0 (equal)
         * as long as we have extra properties to compare
         */
        while(result === 0 && i < numberOfProperties) {
            result = dynamicSort(props[i])(obj1, obj2);
            i++;
        }
        return result;
    }
}

Which would enable you to do something like this:

People.sort(dynamicSortMultiple("Name", "-Surname"));

Subclassing Array

For the lucky among us who can use ES6, which allows extending the native objects:

class MyArray extends Array {
    sortBy(...args) {
        return this.sort(dynamicSortMultiple.apply(null, args));
    }
}

That would enable this:

MyArray.from(People).sortBy("Name", "-Surname");

@Ege Özcan 2013-01-10 15:18:39

Please note that property names in JavaScript can be any string and if you have properties starting with a "-" (extremely unlikely and probably not a good idea), you'll need to modify the dynamicSort function to use something else as a reverse sort indicator.

@Lloyd Banks 2017-07-26 22:06:50

I've noticed that the dynamicSort() in the above example will place capital letters ahead of lowercase letters. For example, if I have the values APd, Aklin, and Abe - the results in an ASC sort should be Abe, Aklin, APd. But with your example, the results are APd, Abe, Aklin. Anyway to correct this behavior?

@Ege Özcan 2017-08-06 08:55:17

@LloydBanks if you are using this strictly for strings, then you can use var result = a[property].localeCompare(b[property]); instead of var result = (a[property] < b[property]) ? -1 : (a[property] > b[property]) ? 1 : 0;.

@dzh 2018-01-19 04:09:11

Just like a top answer, this one fails in cases where undefine properties exist: [ { a: 5 }, {a:2}, {}, {a:1} ]

@Ege Özcan 2018-01-19 16:57:28

@Dzh um, how should the undefined key be handled? There are different things you can do to make that work. 1) Get a default value and use it in comparison like a[property] || defaultVal. 2) Always return -1 (or 1 maybe) if a[property] is null. This is a Turing-complete language, you can't possibly handle all the cases. What happens when a is a getter which throws? There could be unlimited number of cases.

@dzh 2018-01-20 00:37:17

@EgeÖzcan It should either put items to the top or bottom, here's implementation I've ended up using pastebin.com/g4dt23jU

@Ege Özcan 2018-01-23 15:22:07

@Dzh you can add the same escape ( || '' ) above as well and it would work the same. There is no one-size-fits-all solution when it comes to sorting objects.

@Ivijan Stefan Stipić 2018-04-03 05:48:02

This is great solution but have one problem if you compare numbers. Please add this before check: if( !isNaN(a[property]) ) a[property] = Number(a[property]); if( !isNaN(b[property]) ) b[property] = Number(b[property]);

@Zilvinas 2019-02-07 19:10:06

This is great! And all the hasOwnProperty issues could be avoided if one would just use a util class. Util.sortBy( People, "Name", "-Surname" ) & etc.

@Ege Özcan 2019-05-18 15:14:36

@Zilvinas I added a subclass example, but exposing a utility function could indeed be better depending on the codebase.

@Ferrybig 2019-05-07 13:38:32

It is also possible to make a dynamic sorting function when programming in TypeScript, but the types become more tricky in this case.

function sortByKey<O>(key: keyof O, decending: boolean = false): (a: O, b: O) => number {
    const order = decending ? -1 : 1;
    return (a, b): number => {
        const valA = a[key];
        const valB = b[key];
        if (valA < valB) {
            return -order;
        } else if (valA > valB) {
            return order;
        } else {
            return 0;
        }
    }
}

This can be used in TypeScript as the following:

const test = [
    {
        id: 0,
    },
    {
        id: 2,
    }
]

test.sort(sortByKey('id')) // OK
test.sort(sortByKey('id1')) // ERROR
test.sort(sortByKey('')) // ERROR

@Wogan 2009-07-15 03:35:51

It's easy enough to write your own comparison function:

function compare( a, b ) {
  if ( a.last_nom < b.last_nom ){
    return -1;
  }
  if ( a.last_nom > b.last_nom ){
    return 1;
  }
  return 0;
}

objs.sort( compare );

Or inline (c/o Marco Demaio):

objs.sort((a,b) => (a.last_nom > b.last_nom) ? 1 : ((b.last_nom > a.last_nom) ? -1 : 0)); 

@Marco Demaio 2010-02-24 18:29:10

Or inline: objs.sort(function(a,b) {return (a.last_nom > b.last_nom) ? 1 : ((b.last_nom > a.last_nom) ? -1 : 0);} );

@Will Hancock 2012-04-19 11:12:27

Thank you very much, but i'm struggling to see the logic that function follows... what is a & b? are they the 1st and 2nd, then 2nd,3rd then 3rd,4th?!?

@mikemaccana 2012-05-18 09:11:15

@Cerbrus 2013-02-14 10:37:20

return a.last_nom.localeCompare(b.last_nom) will work, too.

@nelsonic 2013-05-09 18:12:19

If wants the CoffeeScript one-liner for this: objs.sort (a,b) -> return (a.last_nom > b.last_nom) ? 1 : ((b.last_nom > a.last_nom) ? -1 : 0)

@Andre Figueiredo 2014-01-08 12:06:25

for those looking for a sort where the field is numeric, the compare function body: return a.value - b.value; (ASC)

@mattdlockyer 2014-02-13 20:27:32

Many hints to this can be found on the MDN pages: developer.mozilla.org/en/docs/Web/JavaScript/Reference/…

@Sophiα2329 2015-01-02 22:19:39

@MarcoDemaio var m=a.last_nom,n=b.last_nom; return m>n-m<n True forced to number is 1, false 0.

@jherax 2015-03-30 23:32:13

@Jim Buck 2015-05-19 15:48:31

The biggest issue with this answer is the lack of details when it comes to dealing with possibly null or undefined properties. I've updated it to include an explanation and detailed implementation.

@0xcaff 2015-12-26 22:30:11

What happens if your sort computation is expensive, how does sort prevent re-comparing the same values?

@Joshua Pinter 2016-02-24 23:51:10

I know it's verbose creating a whole compare function but man does it make following the logic easier. Thanks.

@Fergal 2016-05-19 07:51:55

Because we all love the ternary operator: objs.sort(function compare(a,b) { return a.val < b.val ? -1 : a.val > b.val ? 1 : 0; });

@Marcos Lima 2016-06-01 16:38:05

@Cerbrus localeCompare is important when using accented characters in foreign languages, and more elegant as well.

@Eugene Balashov 2016-10-06 08:40:37

whats wrong in: TypeError: obj.sort is not a function. (In 'compare.sort(compare)', 'obj.sort' is undefined)

@Luckylooke 2017-03-20 10:37:33

@Cerbrus localeCompare in browsers support is IE11+ :/

@mwardm 2017-04-27 11:04:40

@Luckylooke You need IE11 for the optional [, locales][, options] parameters; the localeCompare function itself is supported in earlier versions of IE.

@Fl4v 2017-09-13 15:34:45

Or, with ES6 style : objs.sort((a,b) => (a.last_nom > b.last_nom) ? 1 : ((b.last_nom > a.last_nom) ? -1 : 0));

@dzh 2018-01-19 04:06:43

Answer completely fails with basic example like [ { a: 5 }, {a:2}, {}, {a:1} ]

@Kaushik 2018-02-13 06:52:27

if the key value is mixed with lower case and the upper case then we can make that toLowerCase() and then it will work. otherwise sorting won't work. it will sort all which is starting with uppercase and then the values with lower case.

@Farhad 2018-05-09 19:11:41

re @MarcoDemaio in typescript :: objs.sort( (a: any, b: any) => { return (a.order && b.order) ? (( a.order > b.order ) ? 1 : ( ( b.order > a.order ) ? -1 : 0 )) : 0; } );

@sg28 2018-07-12 23:34:56

Array.sort() is unstable (Moz says itself) ,doesn't work all the time

@Walaszka 2018-09-19 13:58:52

And if you look for comparing multiple properties with accented characters you can use return a.lastname.localeCompare(b.lastname) || a.firstname.localeCompare(b.firstname);

@Ninja Coding 2018-09-25 20:38:23

localeCompare is important when order is case insensitive: A a b C c... (the answer example is case sensitive: A C a b c...)

@Jimeh 2019-04-29 17:33:15

A gotcha with using the accepted answer is if last_nom is null or undefined, the comparison will always return 0 instead of -1 or 1.

@Akitha_MJ 2019-07-24 08:29:57

if someone has a issue of understanding the logic follow this Arr.sort((a,b) => a-b); explanation

@shaheer shukur 2019-09-05 06:40:31

consider adding toLowerCase() to variables during comparison, else uppercase alphabets will come before lowercase alphabets.

@john ktejik 2020-04-25 22:59:34

correct me if I'm wrong, but can't you just have the sort function 'return a.last_nom - b.last_nom;' ???

@Jamie Mason 2014-04-30 10:02:43

Example Usage:

objs.sort(sortBy('last_nom'));

Script:

/**
 * @description
 * Returns a function which will sort an
 * array of objects by the given key.
 *
 * @param  {String}  key
 * @param  {Boolean} reverse
 * @return {Function}
 */
const sortBy = (key, reverse) => {

  // Move smaller items towards the front
  // or back of the array depending on if
  // we want to sort the array in reverse
  // order or not.
  const moveSmaller = reverse ? 1 : -1;

  // Move larger items towards the front
  // or back of the array depending on if
  // we want to sort the array in reverse
  // order or not.
  const moveLarger = reverse ? -1 : 1;

  /**
   * @param  {*} a
   * @param  {*} b
   * @return {Number}
   */
  return (a, b) => {
    if (a[key] < b[key]) {
      return moveSmaller;
    }
    if (a[key] > b[key]) {
      return moveLarger;
    }
    return 0;
  };
};

@Chris22 2018-08-22 06:23:56

thank you for breaking this down, I am trying to understand why digits 1, 0, -1 are used for sort ordering. Even with your explanation above, which looks very good-- I'm still not quite understanding it. I always think of -1 as when using array length property, i.e.: arr.length = -1 means that the item isn't found. I'm probably mixing things up here, but could you help me understand why digits 1, 0, -1 are used to determine order? Thanks.

@Jamie Mason 2018-08-23 09:09:35

This isn't entirely accurate but it might help to think of it like this: the function passed to array.sort is called once for each item in the array, as the argument named "a". The return value of each function call is how the index (current position number) of item "a" should be altered compared to the next item "b". The index dictates the order of the array (0, 1, 2 etc) So if "a" is at index 5 and you return -1 then 5 + -1 == 4 (move it nearer front) 5 + 0 == 5 (keep it where it is) etc. It walks the array comparing 2 neighbours each time until it reaches the end, leaving a sorted array.

@Chris22 2018-08-23 16:28:58

thank you for taking the time to explain this further. So using your explanation and the MDN Array.prototype.sort, I'll tell you what I'm thinking of this: in comparison to a and b, if a is greater than b add 1 to the index of a and place it behind b, if a is less than b, subtract 1 from a and place it in front of b. If a and b are the same, add 0 to a and leave it where it is.

@Mas 2019-03-16 18:12:15

In case you have nested objects

const objs = [{
        first_nom: 'Lazslo',
        last_nom: 'Jamf',
        moreDetails: {
            age: 20
        }
    }, {
        first_nom: 'Pig',
        last_nom: 'Bodine',
        moreDetails: {
            age: 21
        }
    }, {
        first_nom: 'Pirate',
        last_nom: 'Prentice',
        moreDetails: {
            age: 22
        }
    }];

nestedSort = (prop1, prop2 = null, direction = 'asc') => (e1, e2) => {
        const a = prop2 ? e1[prop1][prop2] : e1[prop1],
            b = prop2 ? e2[prop1][prop2] : e2[prop1],
            sortOrder = direction === "asc" ? 1 : -1
        return (a < b) ? -sortOrder : (a > b) ? sortOrder : 0;
    }

and call it like

objs.sort(nestedSort("last_nom"));
objs.sort(nestedSort("last_nom", null, "desc"));
objs.sort(nestedSort("moreDetails", "age"));
objs.sort(nestedSort("moreDetails", "age", "desc"));

@Harvey 2018-08-23 14:39:00

You can use

Easiest Way: Lodash

(https://lodash.com/docs/4.17.10#orderBy)

This method is like _.sortBy except that it allows specifying the sort orders of the iteratees to sort by. If orders is unspecified, all values are sorted in ascending order. Otherwise, specify an order of "desc" for descending or "asc" for ascending sort order of corresponding values.

Arguments

collection (Array|Object): The collection to iterate over. [iteratees=[_.identity]] (Array[]|Function[]|Object[]|string[]): The iteratees to sort by. [orders] (string[]): The sort orders of iteratees.

Returns

(Array): Returns the new sorted array.


var _ = require('lodash');
var homes = [
    {"h_id":"3",
     "city":"Dallas",
     "state":"TX",
     "zip":"75201",
     "price":"162500"},
    {"h_id":"4",
     "city":"Bevery Hills",
     "state":"CA",
     "zip":"90210",
     "price":"319250"},
    {"h_id":"6",
     "city":"Dallas",
     "state":"TX",
     "zip":"75000",
     "price":"556699"},
    {"h_id":"5",
     "city":"New York",
     "state":"NY",
     "zip":"00010",
     "price":"962500"}
    ];

_.orderBy(homes, ['city', 'state', 'zip'], ['asc', 'desc', 'asc']);

@chandan gupta 2018-07-05 11:14:21

It works for me. Here It will keep undefined to the end.

 function sort(items, property, direction) {

    function compare(a, b) {
      if(!a[property] && !b[property]) {
        return 0;
      } else if(a[property] && !b[property]) {
        return -1;
      } else if(!a[property] && b[property]) {
        return 1;
      } else {
        const value1 = a[property].toString().toUpperCase(); // ignore upper and lowercase
        const value2 = b[property].toString().toUpperCase(); // ignore upper and lowercase
        if (value1 < value2) {
          return direction === 0 ? -1 : 1;
        } else if (value1 > value2) {
          return direction === 0 ? 1 : -1;
        } else {
          return 0;
        }
        
      }
    }
    
    return items.sort(compare);
   } 
   
   var items = [
  { name: 'Edward', value: 21 },
  { name: 'Sharpe', value: 37 },
  { name: 'And', value: 45 },
  { name: 'The', value: -12 },
  { name: undefined, value: -12 },
  { name: 'Magnetic', value: 13 },
  { name: 'Zeros', value: 37 }
];
   console.log('Ascending Order:- ');
   console.log(sort(items, 'name', 0));
   console.log('Decending Order:- ');
   console.log(sort(items, 'name', 1));
    
    

@Harunur Rashid 2018-05-30 09:21:19

Way 1 :

You can use Underscore.js. Import underscore first.

 import * as _ from 'underscore';
 let SortedObjs = _.sortBy(objs, 'last_nom');

Way 2 : Use compare function.

function compare(first, second) {
     if (first.last_nom < second.last_nom)
         return -1;
     if (first.last_nom > second.last_nom)
       return 1;
    return 0;
 }

objs.sort(compare);

@0leg 2018-06-04 15:24:36

As of 2018 there is a much shorter and elegant solution. Just use. Array.prototype.sort().

Example:

var items = [
  { name: 'Edward', value: 21 },
  { name: 'Sharpe', value: 37 },
  { name: 'And', value: 45 },
  { name: 'The', value: -12 },
  { name: 'Magnetic', value: 13 },
  { name: 'Zeros', value: 37 }
];

// sort by value
items.sort(function (a, b) {
  return a.value - b.value;
});

@smcstewart 2018-06-18 10:02:18

In the question strings were used for comparison as opposed to numbers. Your answer works great for sorting by numbers, but isn't so good for comparisons by string.

@0leg 2019-03-26 09:10:16

The a.value - b.value used to compare the object's attributes (numbers in this case) can be adopted for the various times of data. For example, regex can be used to compare each pair of the neighboring strings.

@Bob Stein 2019-03-28 11:30:04

@0leg I'd like to see an example here of using regex to compare strings in this way.

@surendrapanday 2019-12-10 08:29:52

This implementation is quite good if you need to sort it by ID. Yeah , you have suggested to use regex to compare neighbouring string which makes solution more complicated whereas purpose of this simpliefied version will be otherwise if regex is used along with given solution. Simplicity is the best.

@Francois Girard 2018-05-28 19:54:49

A simple function that sort an array of object by a property

function sortArray(array, property, direction) {
    direction = direction || 1;
    array.sort(function compare(a, b) {
        let comparison = 0;
        if (a[property] > b[property]) {
            comparison = 1 * direction;
        } else if (a[property] < b[property]) {
            comparison = -1 * direction;
        }
        return comparison;
    });
    return array; // Chainable
}

Usage:

var objs = [ 
    { first_nom: 'Lazslo', last_nom: 'Jamf'     },
    { first_nom: 'Pig',    last_nom: 'Bodine'   },
    { first_nom: 'Pirate', last_nom: 'Prentice' }
];

sortArray(objs, "last_nom"); // Asc
sortArray(objs, "last_nom", -1); // Desc

@manjuvreddy 2020-03-23 17:23:28

This solution worked perfectly for me to sort bi-directional. Thank u

@karthik006 2018-03-26 05:40:06

Using lodash or Underscore, its a piece of cake

> const sortedList = _.orderBy(objs, [last_nom], [asc]); // asc or desc

@Bob Stein 2018-02-24 00:54:56

Given the original example:

var objs = [ 
    { first_nom: 'Lazslo', last_nom: 'Jamf'     },
    { first_nom: 'Pig',    last_nom: 'Bodine'   },
    { first_nom: 'Pirate', last_nom: 'Prentice' }
];

Sort by multiple fields:

objs.sort(function(left, right) {
    var last_nom_order = left.last_nom.localeCompare(right.last_nom);
    var first_nom_order = left.first_nom.localeCompare(right.first_nom);
    return last_nom_order || first_nom_order;
});

Notes

  • a.localeCompare(b) is universally supported and returns -1,0,1 if a<b,a==b,a>b respectively.
  • || in the last line gives last_nom priority over first_nom.
  • Subtraction works on numeric fields: var age_order = left.age - right.age;
  • Negate to reverse order, return -last_nom_order || -first_nom_order || -age_order;

@sg28 2017-08-27 10:26:42

I will give you a solution implementing selectionSort algorithm ,it is simple and effective

var objs = [ 
{ first_nom: 'Lazslo', last_nom: 'Jamf'     },
{ first_nom: 'Pig',    last_nom: 'Bodine'   },
{ first_nom: 'Pirate', last_nom: 'Prentice' }
];


function selection_Sort(num) { 
 //console.log(num);  
 var temp, index;
 for (var i = 0; i <= num.length - 1; i++) {
index = i;
for (var j = i + 1; j <= num.length - 1; j++) {
 // you can use first_nom/last_nom,any way you choose to sort

  if (num[j]. last_nom < num[index]. last_nom) {
    index = j;
  } 
}

//below is the swapping part
temp = num[i]. last_nom;
num[i]. last_nom = num[index]. last_nom;
num[index]. last_nom = temp;
 };
 console.log(num); 
 return num; 
  }
  selection_Sort(objs);

Great to see such great answers

@Sridhar Sg 2017-07-05 07:43:55

Using Ramda,

npm install ramda

import R from 'ramda'
var objs = [ 
    { first_nom: 'Lazslo', last_nom: 'Jamf'     },
    { first_nom: 'Pig',    last_nom: 'Bodine'   },
    { first_nom: 'Pirate', last_nom: 'Prentice' }
];
var ascendingSortedObjs = R.sortBy(R.prop('last_nom'), objs)
var descendingSortedObjs = R.reverse(ascendingSortedObjs)

@Partha Roy 2016-12-09 14:55:33

So here is one sorting algorithm which can sort in any order , throughout array of any kind of objects , without the restriction of datatype comparison ( i.e. Number , String )

function smoothSort(items,prop,reverse) {  
    var length = items.length;
    for (var i = (length - 1); i >= 0; i--) {
        //Number of passes
        for (var j = (length - i); j > 0; j--) {
            //Compare the adjacent positions
            if(reverse){
              if (items[j][prop] > items[j - 1][prop]) {
                //Swap the numbers
                var tmp = items[j];
                items[j] = items[j - 1];
                items[j - 1] = tmp;
            }
            }

            if(!reverse){
              if (items[j][prop] < items[j - 1][prop]) {
                  //Swap the numbers
                  var tmp = items[j];
                  items[j] = items[j - 1];
                  items[j - 1] = tmp;
              }
            }
        }
    }

    return items;
}
  • the first argument items is the array of objects ,

  • prop is the key of the object on which you want to sort ,

  • reverse is a boolean parameter which on being true results in Ascending order and in false it returns descending order.

@depiction 2016-09-09 01:48:46

This will sort a two level nested array by the property passed to it in alpha numeric order.

function sortArrayObjectsByPropAlphaNum(property) {
    return function (a,b) {
        var reA = /[^a-zA-Z]/g;
        var reN = /[^0-9]/g;
        var aA = a[property].replace(reA, '');
        var bA = b[property].replace(reA, '');

        if(aA === bA) {
            var aN = parseInt(a[property].replace(reN, ''), 10);
            var bN = parseInt(b[property].replace(reN, ''), 10);
            return aN === bN ? 0 : aN > bN ? 1 : -1;
        } else {
            return a[property] > b[property] ? 1 : -1;
        }
    };
}

Usage:

objs.sort(utils.sortArrayObjectsByPropAlphaNum('last_nom'));

@Luke Schoen 2016-07-09 05:38:03

// Sort Array of Objects

// Data
var booksArray = [
    { first_nom: 'Lazslo', last_nom: 'Jamf'     },
    { first_nom: 'Pig',    last_nom: 'Bodine'   },
    { first_nom: 'Pirate', last_nom: 'Prentice' }
];

// Property to Sort By
var args = "last_nom";

// Function to Sort the Data by given Property
function sortByProperty(property) {
    return function (a, b) {
        var sortStatus = 0,
            aProp = a[property].toLowerCase(),
            bProp = b[property].toLowerCase();
        if (aProp < bProp) {
            sortStatus = -1;
        } else if (aProp > bProp) {
            sortStatus = 1;
        }
        return sortStatus;
    };
}

// Implementation
var sortedArray = booksArray.sort(sortByProperty(args));

console.log("sortedArray: " + JSON.stringify(sortedArray) );

Console log output:

"sortedArray: 
[{"first_nom":"Pig","last_nom":"Bodine"},
{"first_nom":"Lazslo","last_nom":"Jamf"},
{"first_nom":"Pirate","last_nom":"Prentice"}]"

Adapted based on this source: http://www.levihackwith.com/code-snippet-how-to-sort-an-array-of-json-objects-by-property/

@Ravshan Samandarov 2016-06-26 09:10:05

One more option:

var someArray = [...];

function generateSortFn(prop, reverse) {
    return function (a, b) {
        if (a[prop] < b[prop]) return reverse ? 1 : -1;
        if (a[prop] > b[prop]) return reverse ? -1 : 1;
        return 0;
    };
}

someArray.sort(generateSortFn('name', true));

sorts ascending by default.

@Ravshan Samandarov 2016-12-01 12:37:39

Slightly changed version for sorting by multiple fields is here if needed: stackoverflow.com/questions/6913512/…

@Den Kerny 2020-05-23 04:29:10

it looks like it could be the next one: export function generateSortFn( prop: string, reverse: boolean = false ): (...args: any) => number { return (a, b) => { return a[prop] < b[prop] ? reverse ? 1 : -1 : a[prop] > b[prop] ? reverse ? -1 : 1 : 0; }; }

@Den Kerny 2020-05-25 02:00:10

agreed, but in some case i haven't got needs to look at utility functions.

@Tero Tolonen 2016-05-05 11:36:14

There are many good answers here, but I would like to point out that they can be extended very simply to achieve a lot more complex sorting. The only thing you have to do is to use the OR operator to chain comparision functions like this:

objs.sort((a,b)=> fn1(a,b) || fn2(a,b) || fn3(a,b) )

Where fn1, fn2, ... are the sort functions which return [-1,0,1]. This results in "sorting by fn1", "sorting by fn2" which is pretty much equal to ORDER BY in SQL.

This solution is based on the behaviour of || operator which evaluates to the first evaluated expression which can be converted to true.

The simplest form has only one inlined function like this:

// ORDER BY last_nom
objs.sort((a,b)=> a.last_nom.localeCompare(b.last_nom) )

Having two steps with last_nom,first_nom sort order would look like this:

// ORDER_BY last_nom, first_nom
objs.sort((a,b)=> a.last_nom.localeCompare(b.last_nom) || 
                  a.first_nom.localeCompare(b.first_nom)  )

A generic comparision function could be something like this:

// ORDER BY <n>
let cmp = (a,b,n)=>a[n].localeCompare(b[n])

This function could be extended to support numeric fields, case sensitity, arbitary datatypes etc.

You can them use it with chaining them by sort priority:

// ORDER_BY last_nom, first_nom
objs.sort((a,b)=> cmp(a,b, "last_nom") || cmp(a,b, "first_nom") )
// ORDER_BY last_nom, first_nom DESC
objs.sort((a,b)=> cmp(a,b, "last_nom") || -cmp(a,b, "first_nom") )
// ORDER_BY last_nom DESC, first_nom DESC
objs.sort((a,b)=> -cmp(a,b, "last_nom") || -cmp(a,b, "first_nom") )

The point here is that pure JavaScript with functional approach can take you a long way without external libraries or complex code. It is also very effective, since no string parsing have to be done

Related Questions

Sponsored Content

95 Answered Questions

[SOLVED] How can I remove a specific item from an array?

  • 2011-04-23 22:17:18
  • Walker
  • 6844623 View
  • 8422 Score
  • 95 Answer
  • Tags:   javascript arrays

53 Answered Questions

42 Answered Questions

[SOLVED] How do I remove a property from a JavaScript object?

30 Answered Questions

[SOLVED] Sorting an array of objects by property values

3 Answered Questions

40 Answered Questions

[SOLVED] For-each over an array in JavaScript

15 Answered Questions

[SOLVED] From an array of objects, extract value of a property as array

21 Answered Questions

[SOLVED] Storing Objects in HTML5 localStorage

23 Answered Questions

[SOLVED] How to sort an array of integers correctly

34 Answered Questions

[SOLVED] How do I sort a dictionary by value?

Sponsored Content