JavaScript callback function inside sort () a and b variables

Question

I am trying to understand how the sort() function works with the passed callback function. More specifically, the values ​​of a and b

Code example:

 var n = [4, 11, 2, 10, 3, 1]; n.sort(function(a, b) { console.log(a); console.log(b); console.log('--') return ab; }); 

Result:

 4 11 -- 11 2 -- 4 2 -- 11 10 -- 4 10 -- 11 3 -- 10 3 -- 4 3 -- 2 3 -- 11 1 -- 10 1 -- 4 1 -- 3 1 -- 2 1 -- 

In the first round, I can follow that a = 4 and b = 11 are easy to follow.

In the second round, I can follow that a = 11 and b = 2.

But after that, I’m a little bit different from what really happens, for example, when you reach, when a = 4 and b = 3. How does it work? I tried to work on paper, but did not see the output logic a and b .

Answer 1

You can see it like this. When you have two numbers, compare a (previous) and b (next).
If a is greater than b, put it after b.
If a is less than b, put it before b.
In fact, when you have the case "a> b", you can return any positive number: put a after b.
And, when you have the case of 'a <b', you can return any negative number: put a to b. This is essentially a comparison of two numbers at a time.

The position in the array can be understood below. Seen from the perspective of return ab , if you are returning a negative number, put a to b; if you return a positive number, put a after b. negative numbers are zero positive numbers.

Perhaps you can understand this better by printing the content to n at runtime.

 window.n = [4, 11, 2, 10, 3, 1]; n.sort(function(a, b) { console.log(a); console.log(b); console.log(window.n); // You can see what is in n in the every comparison console.log('--') return ab; }); 

Result in Chrome v64.0.3282

 4 11 (6) [4, 11, 2, 10, 3, 1] -- 11 2 (6) [4, 11, 2, 10, 3, 1] -- 4 2 (6) [4, 11, 11, 10, 3, 1] -- 11 10 (6) [2, 4, 11, 10, 3, 1] -- 4 10 (6) [2, 4, 11, 11, 3, 1] -- 11 3 (6) [2, 4, 10, 11, 3, 1] -- 10 3 (6) [2, 4, 10, 11, 11, 1] -- 4 3 (6) [2, 4, 10, 10, 11, 1] -- 2 3 (6) [2, 4, 4, 10, 11, 1] -- 11 1 (6) [2, 3, 4, 10, 11, 1] -- 10 1 (6) [2, 3, 4, 10, 11, 11] -- 4 1 (6) [2, 3, 4, 10, 10, 11] -- 3 1 (6) [2, 3, 4, 4, 10, 11] -- 2 1 (6) [2, 3, 3, 4, 10, 11] -- (6) [1, 2, 3, 4, 10, 11] // result 

Your code returns the same result as below:

 var n = [4, 11, 2, 10, 3, 1]; n.sort(function(a, b) { console.log(a); console.log(b); console.log('--') if (a > b) { return 1; } else { return -1; } }); (6) [1, 2, 3, 4, 10, 11] // result 

OR

 var n = [4, 11, 2, 10, 3, 1]; n.sort((a, b) => a > b ? 1 : -1); (6) [1, 2, 3, 4, 10, 11] // result 

Answer 2

Looks like a modified sorting of bubbles. You can see what happens when you compare the state of the array at each step - I added them below.

Move the value from index 1 as low as possible. (index 0-1 is ok) Now move the value from index 2 as low as possible. (index 0-2 is ok) Now move the value from index 3 as low as possible. (index 0-3 is ok)

Since we know how much of the array is in order, we short-circuit the comparisons and move on to the next index as soon as the comparison function is not negative.

 4 11 -- [4, 11, 2, 10, 3, 1]; 11 2 -- [4, 2, 11, 10, 3, 1]; 4 2 -- [2, 4, 11, 10, 3, 1]; 11 10 -- [2, 4, 10, 11, 3, 1]; 4 10 -- [2, 4, 10, 11, 3, 1]; 11 3 -- [2, 4, 10, 3, 11, 1]; 10 3 -- [2, 4, 3, 10, 11, 1]; 4 3 -- [2, 3, 4, 10, 11, 1]; 2 3 -- [2, 3, 4, 10, 11, 1]; 11 1 -- [2, 3, 4, 10, 1, 11]; 10 1 -- [2, 3, 4, 1, 10, 11]; 4 1 -- [2, 3, 1, 4, 10, 11]; 3 1 -- [2, 1, 3, 4, 10, 11]; 2 1 -- [1, 2, 3, 4, 10, 11];