How to sort an array of objects based on a the length of a nested array in javascript

Question

I have an array of objects in javascript, each of which in turn has an array:

{
    category: [ 
        { name: "Cat1", elements : [ 
            { name: name, id: id } ] 
        },
        { name: "Cat2", elements : [ 
            { name: name, id: id },
            { name: name, id: id },
            { name: name, id: id } ] 
        }, 
        { name: "Cat3", elements : [ 
            { name: name, id: id },
            { name: name, id: id } ] 
        }
    ]
}

I would like to sort the array "category" based on the number of objects within the nested array "elements".

For example, after sorting, the above object might look like this (descending):

{
    category: [ 
        { name: "Cat2", elements : [ 
            { name: name, id: id },
            { name: name, id: id },
            { name: name, id: id } ] 
        }, 
        { name: "Cat3", elements : [ 
            { name: name, id: id },
            { name: name, id: id } ] 
        },
        { name: "Cat1", elements : [ 
            { name: name, id: id } ] 
        }

    ]
}

I am wondering if it is possible to accomplish this using javascript's sort() method. Any suggestions?

Thanks in advance!

score 19 · Accepted Answer · edited Feb 20 '10 at 10:49

The sort method accepts a function in which you can define how to compare two elements. Here's the relevant documentation.

compareFunction Specifies a function that defines the sort order. If omitted, the array is sorted lexicographically (in dictionary order) according to the string conversion of each element.

If compareFunction is supplied, the array elements are sorted according to the return value of the compare function. If a and b are two elements being compared, then:

If compareFunction(a, b) is less than 0, sort a to a lower index than b.
If compareFunction(a, b) returns 0, leave a and b unchanged with respect to each other, but sorted with respect to all different elements. Note: the ECMAscript standard does not guarantee this behaviour, and thus not all browsers (e.g. Mozilla versions dating back to at least 2003) respect this.
If compareFunction(a, b) is greater than 0, sort b to a lower index than a.

Example code

var sorted_categories = original.category.sort(function (one, other) {
   //a - b is 
   //   0 when elements are the same
   //  >0 when a > b
   //  <0 when a < b
   return one.elements.length - other.elements.length;
});

It makes sense to cache the results of `elements.length` function as it will be called O(n * log n) times, i.e. a lot. — vava, Feb 20 '10 at 10:50
@Mrworldwide Switch one and other in the return statement like so `return other.elements.length - one.elements.length;` — Erwin Lengkeek, Feb 27 '19 at 06:25

score -1 · Answer 2 · answered Feb 20 '10 at 10:42

var category = [ 
        { name: "Cat1", elements : [ 
            { name: name, id: id } ] 
        },
        { name: "Cat2", elements : [ 
            { name: name, id: id },
            { name: name, id: id },
            { name: name, id: id } ] 
        }, 
        { name: "Cat3", elements : [ 
            { name: name, id: id },
            { name: name, id: id } ] 
        }
];

function myAbcSort(a, b){
    if(a.elements.length > b.elements.length) {
        return -1;
    } else {
        return 1;
    }
}
category.sort(myAbcSort);

Wrong. You must return 0 for the case `a.elements.length == b.elements.length`. — kennytm, Feb 20 '10 at 10:50

How to sort an array of objects based on a the length of a nested array in javascript

2 Answers2

Example code

Linked

Related