HomeSearch

JavaScript Sort String Arrays

Order the elements in a string array with the sort method. The array is modified in-place.
Sort. Imagine a million lines of text. With no sorting it is impossible to find a certain line. But with sorting it can be easily located.
In JavaScript we discover a sort method on arrays. This method can receive a function that determines how elements are sorted. With no arguments, it sorts in an ascending order.Array
First example. Here we introduce an array called "patterns" that has 3 strings in it. We then invoke sort() on our patterns array.

Result: The array's elements are reordered. The string "abc" comes first as it is the earliest alphabetically.

JavaScript program that uses sort, string array var patterns = ["def", "xyz", "abc"]; // Sort the string array. patterns.sort(); console.log("SORTED: " + patterns); Output SORTED: abc,def,xyz
Modifies in-place. We can assign a variable to the result of sort() but there is no point to this. Sort() modifies the existing array.

Tip: To keep the originally-ordered array around, a copy of the array would need to be made.

JavaScript program that shows sort modifies array var patterns = ["def", "xyz", "abc"]; var result = patterns.sort(); // The original array is sorted. console.log("VARIABLE 1: " + patterns); console.log("VARIABLE 2: " + result); Output VARIABLE 1: abc,def,xyz VARIABLE 2: abc,def,xyz
Integer array. In most programming languages numbers are sorted as numbers. But in JavaScript we find that numbers are sorted as strings. So 10 comes before 2 because 1 comes before 2.

Here: We override the default sorting behavior with a function. In our function "compare" we sort two integers by their difference.

So: Numbers are sorted by their numeric values, and smaller numbers precede larger ones.

JavaScript program that uses sort, integer array var numbers = [-1, 100, 10, 1, 2, 3]; // Numbers are sorted as strings by default. numbers.sort(); console.log("SORT 1: " + numbers); // This function sorts numbers. // ... We compare two numbers by subtracting one from the other. var compare = function(a, b) { return a - b; }; // Sort numbers in a numeric way. numbers.sort(compare); console.log("SORT 2: " + numbers); Output SORT 1: -1,1,10,100,2,3 SORT 2: -1,1,2,3,10,100
LocaleCompare. The localeCompare method handles non-ASCII characters (like those with accents) in a correct way. It should be used when sorting strings.

Here: We use localCompare to sort a string array from low to high (in ascending alphabetical order).

Then: We use a descending string sort. We compare the second string to the first in reverseAlphabetical.

Tip: It is possible to call reverse() after sorting a string array. But with localeCompare we can directly sort in reverse order.

JavaScript program that uses localeCompare var unsorted = ["def", "xyz", "ghi", "abc"]; function alphabetical(a, b) { // Use localeCompare. return a.localeCompare(b); } function reverseAlphabetical(a, b) { // Use localeCompare with second compared to first. return b.localeCompare(a); } // Sort in alphabetical order. unsorted.sort(alphabetical); console.log("LOCALECOMPARE 1: " + unsorted); // Sort in reverse alphabetical order. unsorted.sort(reverseAlphabetical); console.log("LOCALECOMPARE 2: " + unsorted); Output LOCALECOMPARE 1: abc,def,ghi,xyz LOCALECOMPARE 2: xyz,ghi,def,abc
Some notes. Arrays are common in JavaScript programs. We use them everywhere. With sort() we change the ordering of elements in arrays to conform to a pattern.
© 2007-2019 Sam Allen. Every person is special and unique. Send bug reports to info@dotnetperls.com.
Home
Dot Net Perls