javascript array.sort not working with integers

Question

I'm having issues with javascript array sorting and integers. I have these functions defined:

function sortA(a,b){ 
  return a - b;
}
function sortD(a,b){ 
  return b - a;
}

then in a jquery $.each, I put some content in the arrays:

$('.'+sort_column).each(function(index, value) {

    var current_num = $.trim($(this).text())

    current_num = parseInt(current_num, 10); //convert to integer for numeric sorting.

    valuesArr.push(current_num);  

    console.log(typeof index); //just checking...this shows number in the console
});

var sort_asc = valuesArr.sort(sortA);
var sort_desc = valuesArr.sort(sortD);
console.log(sort_asc);
console.log(sort_desc);

but in the console, I get the arrays in the same order.

//console
[1214500, 1214499, 1214497, 1214481, 1214432, 1214421, 1214419, 1214418, 1214369, 1214045, 1205691]
[1214500, 1214499, 1214497, 1214481, 1214432, 1214421, 1214419, 1214418, 1214369, 1214045, 1205691]

curiously, if I append a string to the end, the sorting works

console.log( valuesArr.sort(sortD)  + "asdf");
console.log( valuesArr.sort(sortA)  + "asdf");

//console
[1214500,1214499,1214497,1214481,1214432,1214421,1214419,1214418,1214369,1214045,1205691asdf] 
[1205691,1214045,1214369,1214418,1214419,1214421,1214432,1214481,1214497,1214499,1214500asdf]

I don't know why I even tried that, but there you go. This is the first time I've worked with this method, so I've likely missed something quite basic. Many thanks for any help!

there is a gotcha with the chrome console that it doesn't log an object's state at the time of logging, when you do `+ "asd"`, it logs a string, not an object, so it logs "correctly". — Esailija, Jun 03 '12 at 18:00
@Esailija: That's correct, but Chrome's `console.log` converts arrays into strings anyway. — Felix Kling, Jun 03 '12 at 18:02
@Esailija: Okay. I don't really understand the "doesn't log an object's state at the time of logging". Which state does it log? ^^ And by making new variables for the new arrays `var sort_asc = valuesArr.sort(sortA); var sort_desc = valuesArr.sort(sortD);` how can it even display those if the instant they're created they're populated with the sorted values? I also don't really understand why making the object into a string would give a more accurate picture. Sorry..that was a lot of questions.. — 1252748, Jun 03 '12 at 18:14
@thomas it's not directly related to your problem, just the first thing that popped into my head, and chrome seems to have fixed it for arrays anyway. The real problem is that a new array is not created with `.sort` so you're sorting the same array all the time and only the last result will be thus visible to you. See Felix Kling's answer — Esailija, Jun 03 '12 at 18:22
@thomas: Esailija was referring to [this problem](http://stackoverflow.com/questions/8249136/why-does-javascript-object-show-different-values-in-console-in-chrome-firefox), which is important to know about, but does not apply in your case. — Felix Kling, Jun 03 '12 at 18:26
I'm still a bit unclear though on if this _isn't_ my problem, why appending a text string to the end seemed to solve the issue.. — 1252748, Jun 04 '12 at 14:23

score 4 · Accepted Answer · answered Jun 03 '12 at 18:13

You're sorting the same array's instance, that's why the order is the same. Basically sort changes the content of the array itself.

So both of them will be in desc order (that is the last sorting you're doing). If you want to keep the original instance intact, you should create new arrays:

var sort_asc = valuesArr.slice(0).sort(sortA);
var sort_desc = valuesArr.slice(0).sort(sortD);

console.log(valuesArr);
console.log(sort_asc);
console.log(sort_desc);

See also slice.

Felix Kling · Answer 2 · 2012-06-03T18:27:00.580

2

.sort() ^[MDN] sorts the array in-place. Both variables sort_asc and sort_desc reference the same array and therefore the output is the same.

edited Jun 03 '12 at 18:27

answered Jun 03 '12 at 18:00

Felix Kling

795,719
175
1,089
1,143

Can you explain a little further why you use slice instead of just `var sort_asc = valuesArr; sort_desc = valuesArr;`? Thanks – 1252748 Jun 04 '12 at 13:41
1

@thomas: I think you refer to Zer0's answer ;) You cannot sort the same array in two different ways at the same time. `.slice` will create a copy of the array, which then is sorted. – Felix Kling Jun 04 '12 at 14:05

score 2 · Answer 3 · answered Jun 03 '12 at 20:02

2

you can simply change your sortA() and sortD() like following:

function sortA(arr) {
    return arr.sort(function(a, b) {
       return a - b;
    });
}

function sortD(arr) {
    return arr.sort(function(a, b) {
       return b - a;
    });
}

And then use like following:

var myarr = [1214500, 1214499, 1214497, 1214481, 1214432, 1214421, 
             1214419, 1214418, 1214369, 1214045, 1205691];

sortA(myarr);

sortD(myArr);

DEMO

answered Jun 03 '12 at 20:02

thecodeparadox

86,271
21
138
164

What's the advantage? How does this related to the problem? – Felix Kling Jun 04 '12 at 10:57
@FelixKling I think OP has problem of sorting array and above solution works well. If I misunderstand OP's point then please comment me – thecodeparadox Jun 04 '12 at 11:03
The OP was confused about the output of the sort operation, since he did not know that the arrays are sorted in-place. But the way he uses `.sort` is correct. – Felix Kling Jun 04 '12 at 14:07

javascript array.sort not working with integers

3 Answers3