Order of parameters in javascript array sort method is not intuitive

Question

So I create two objects:

var obj1 = {
    "id" : 123,
    "name" : "Hello"
}

var obj2 = {
    "id" : 456, 
    "name" : "Goodbye"
}

Then I insert these into an array:

var arr = [obj1, obj2];

I then store the result of sorting into a variable and log to the console:

var test = arr.sort(function(x, y) {
    console.log("x ", x)
    console.log("y ", y)
});

console.log(test);

The result is:

x  {id: 456, name: 'Goodbye'}
y  {id: 123, name: 'Hello'}

I was expecting the order to be the same as the occurrence of the objects in the array since I have not defined any sort criterion. Why is the order as such?

Answer 1

If you had to just type in arr and press enter after the sort you will see that the array is still in the order of 'hello' and then 'goodbuy' the sort didnt change the data as there is no way for the system to compare the objects unless you create a compare function to give the sort call.

The compare function you have provided just prints the first and second values being compared.

Seen that you cant compare the first value to nothing i.e. it has nothing pervious to compare to it starts at the second entry and goes... I need to compare this to something... Lets try the first element.

if you had to add more elements you would see this clearly.

var arr = [{
  "id" : 123,
  "name" : "Hello"
}, {
  "id" : 456, 
  "name" : "Goodbye"
}, {
  "id" : 999, 
  "name" : "Its clear now"
}];
var test = arr.sort(function(x, y) {
  console.log("x ", x)
  console.log("y ", y)
});

console.log(test);

So as you can see it compares second to first it then compares third to second. The sort is complete.

Doing the same with numbers and actually sorting

you get

position 2 compares to position 1 and returns -1 so its smaller and must moves into position 1

[2,3,1,6,5]

position 3 compares to position 1 and returns -1 so its smaller and must moves into position 1

[1,2,3,6,5]

position 4 compares to position 1 and returns 5 so its larger and must remain in place

[1,2,3,6,5]

position 4 compares to position 2 and returns 4 so its larger and must remain in place

[1,2,3,6,5]

position 4 compares to position 3 and returns 3 so its larger and must remain in place

[1,2,3,6,5]

position 4 has nothing in front of it to compare to so we move to the next position

position 5 compares to position 1( of the original array) and returns 2 so its larger and it uses normal binary search logic to try another position (next compare)

[1,2,3,6,5]

finally position 5 compares to position 4 and returns -1 so it knows it must move into position 4

[1,2,3,5,6]

Answer 2

sort() documentation, from documentation it is implementation-defined in case you don't provide valid sorting function, if you want to keep it same way you can return 0

var obj1 = {
    "id" : 123,
    "name" : "Hello"
}

var obj2 = {
    "id" : 456, 
    "name" : "Goodbye"
}


var arr = [obj1, obj2];

var test =arr.sort((x,y)=>{
   console.log("x ", x)
    console.log("y ", y)
    return 0;
 }
)

/* var test = arr.sort(function(x, y)) {
    console.log("x ", x)
    console.log("y ", y)
    return 0;
}); */

console.log(test);