How does JavaScript's sort (compareFunction) work?

Question

var arr = [5, 2, 1, -10, 8];

arr.sort(function(a, b) {
  console.log(a,b)
  return b - a;

}) ; // 8, 5, 2, 1, -10

How does this callback work?

What is the principle of choice a and b?

Please explain this particular example from the inside.

output console.log (at first, please explain this output ):

  5 2
  2 1
  1 -10
 -10 8
  1 8
  2 8
  5 8

Answer 1

It depends on the implementation. This actual implementation, looks like an insertion sort, with this amount of data (it could be different, like with Chrome, and the different implementation for less than 10 items or more items), is going from index zero to the end and if a swap has not taken place at the last two items, then it stops, otherwise it goes backwards to index zero.

Basically it tests and changes in this order

5   2   1 -10   8   original order
5   2
    2   1
        1 -10
          -10   8   swap
            8 -10
        1   8       swap
        8   1
    2   8           swap
    8   2
5   8               swap
8   5  2    1 -10   result

A more complex sorting shows better what is going on, with two greater values, which need to move to the other side of the array

8   9   1   2   3   4   original array
8   9
    9   1               swap
    1   9
8   1                   swap
1   8
        9   2           swap
        2   9
    8   2               swap
    2   8
1   2
            9   3       swap
            3   9
        8   3           swap
        3   8
    2   3
                9   4   swap
                4   9
            8   4       swap
            4   8
        3   4
1   2   3   4   8   9   result

Live example, does not work in all user agents (eg not in Edge, but in Chrome)

var array = [8, 9, 1, 2, 3, 4];
console.log(JSON.stringify(array));
array.sort(function (a, b) {
    console.log(a , b, JSON.stringify(array));
    return a - b;
});
console.log(JSON.stringify(array));

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 2

.sort() with custom function must return number indicating witch item must be placed in front:

< 0 - First element must be placed before second
   0 - Both elements is equal, do not change order.
> 0 - Second element must be placed before first.

---

Usually b - a means descendant sorting while a - b means ascendant ordering.

---

What algorithm is used to sort elements depends on browser implementation of .sort. Check comparison of them:

Answer 3

It will sort the item by the subtracted value by moving it that value lower or higher.

Here is some info:

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/sort

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, i.e. a comes first.
• 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.
• compareFunction(a, b) must always return the same value when given a specific pair of elements a and b as its two arguments. If inconsistent results are returned then the sort order is undefined.

So, the compare function has the following form:

function compare(a, b) {
  if (a is less than b by some ordering criterion) {
    return -1;
  }
  if (a is greater than b by the ordering criterion) {
    return 1;
  }
  // a must be equal to b
  return 0;
}

To compare numbers instead of strings, the compare function can simply subtract b from a. The following function will sort the array ascending (if it doesn't contain Infinity and NaN):

function compareNumbers(a, b) {
  return a - b;
}