UTF-16 stands for 16-bit Unicode Transformation Format. It's a form of translating bits into a format known to humans.
Just like the ASCII, UTF-16 has its own table of translations for a given character. Moreover, according to Wikipedia, JavaScript uses UTF-16 as its encoding.
Therefore, because JavaScript uses UTF-16 internally, and when we invoke the sort function.
We are essentially sorting against the UTF-16 character table. Therefore it is done based on character appearance rather than mathematical reasoning or rules.
I hope you got the message, guys! And hopefully, you won't be scratching your head now 😉.
The Comparer Callback Function
Using the default sort function wouldn't be so helpful, in my opinion. However, and thankfully, this function takes an optional callback (the comparer function).
This comparer function makes the items in the array sorted based on the returned value.
In general, this callback function takes two arguments, A and B. And use these arguments to create an expression that either returns 1,-1, or 0.
Let's see how we can create a compare function to sort the array elements.
- function compare(a, b) {
-
- if (a > b) return 1;
- if (b > a) return -1;
-
- return 0;
- }
Here are things to remember with the code sample above.
If the function returns:
- less than zero, A comes before B.
- greater than zero, B comes before A.
- to zero, A and B positions are left unchanged.
If you think that the compare function, which is the example in this section, can be refactored into a simpler code, you're right.
Let's see how we can do that; see the example below.
- function compare(a, b) {
- return a - b;
- }
JavaScript Sorting Arrays of Number, Strings, Dates, and Objects.
Sort Arrays of Numbers
If you have read the previous section, this would be easy for you to understand.
Let's jump ahead to see an example.
- const myNums = [100, 1001, 20, 1, 56, 989];
-
- const compareAsc = (a, b) => (a - b);
- const compareDesc = (a, b) => (b - a);
-
- console.log(myNums.sort(compareAsc));
-
-
- console.log(myNums.sort(compareDesc));
-
Sort Arrays of Strings
When dealing with strings, we can use JavaScript's localCompare method. It is highly recommended because it gives you much more options.
Furthermore, it has built-in support for things like language-specific sort ordering, ignoring cases, or diacritics.
- const names = ['Jin', 'Vincent', 'Necesario'];
-
- const compareAsc = (a, b) => a.localeCompare(b, 'en', { sensitivity: 'base' });
- const compareDesc = (a, b) => b.localeCompare(a, 'en', { sensitivity: 'base' });
-
- console.log(names.sort(compareAsc));
-
-
- console.log(names.sort(compareDesc));
-
Sort Arrays of Dates
Comparing or sorting dates is easy. If you have seen how we can sort the numbers, we can then easily apply these to type Dates.
Let's jump ahead to see an example.
- const _dates = [new Date(1990, 3, 5), new Date(2000, 3, 5), new Date(1980, 11, 10)];
-
- const compareAsc = (a, b) => a - b;
- const compareDesc = (a, b) => b - a;
-
-
- console.log(_dates.sort(compareAsc).map((item) => item.toDateString()));
-
-
- console.log(_dates.sort(compareDesc).map((item) => item.toDateString()));
-
Sort Arrays of Objects
When comparing the properties of an object, we just have to combine the existing knowledge we have from the previous examples. Therefore, we can develop a solution on how we can sort these objects by their properties.
Let's see an example below.
- const basketBallPlayers = [
- {
- name: "Lebron James",
- jersey: 23,
- birthDate: new Date(1984, 12, 30)
- },
- {
- name: "Kobe Bryant",
- jersey: 24,
- birthDate: new Date(1978, 8, 23)
- },
- {
- name: "Michael Jordan",
- jersey: 23,
- birthDate: new Date(1963, 2, 17)
- },
- {
- name: "Jason Kidd",
- jersey: 5,
- birthDate: new Date(1973, 3, 23)
- }
-
- ];
-
-
- function compareValues(key, order = 'asc') {
-
- return (a, b) => {
-
- if (typeof a[key] === "number" && typeof b[key] === "number") {
- return order === 'asc' ? a[key] - b[key] : b[key] - a[key];
- }
- else if (typeof a[key] === "object" && typeof b[key] === "object") {
- if (a[key] instanceof Date && b[key] instanceof Date) {
- return order === 'asc' ? a[key] - b[key] : b[key] - a[key];
- }
- }
- else if (typeof a[key] === "string" && typeof b[key] === "string") {
- return order === 'asc' ? a[key].localeCompare(b[key], 'en', { sensitivity: 'base'}): b[key].localeCompare(a[key], 'en', { sensitivity: 'base'}) ;
- }
- };
- }
-
- console.log(basketBallPlayers.sort(compareValues('birthDate', 'desc')));
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- console.log(basketBallPlayers.sort(compareValues('name')));
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- console.log(basketBallPlayers.sort(compareValues('jersey')));
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
Summary
Great! You have made it this far.
This article has shown how we can use the JavaScript [].sort method to sort arrays of numbers, string, dates, and objects.
Once again, I hope you have enjoyed this article/tutorial as I have enjoyed writing it.
This article was originally written and posted here.
Stay tuned for more. Until next time, happy programming!
Please don't forget to bookmark, like, and comment. Cheers! And Thank you!