We Keep Coding

Javascript Sorting an Array like order by in Oracle

I have an Array that I need to sort exactly like using order by in Oracle SQl.
If I have following Array:
var array = ['Ba12nes','Apfel','Banane','banane','abc','ABC','123','2', null,'ba998ne']
var.sort(compare);
I would like to have the following result
var array = ['abc','ABC','Apfel','banane','Banane','Ba12nes','ba998ne','123','2', null]
If the null values are somewhere else, I don't have a Problem with it.
My current solution, which does not help me ^^
function compare(a,b) {
if(a == null)
return -1;
if (b == null)
return 1;
if (a.toLowerCase() < b.toLowerCase())
return -1;
if (a.toLowerCase() > b.toLowerCase())
return 1;
return 0;
}
I do understand that i need a custom sorting function. And at the moment I am thinking that only a regular expression can solve the problem of sorting the string values in front of the numbers. But I am still not sure how to solve the Problem with lowercase letters in bevor Uppercase letters.

Iirc, Oracle implements a 3-tiered lexicographic sorting (but heed the advice of Alex Poole and check the NLS settings first):
First sort by base characters ignoring case and diacritics, digits come after letters in the collation sequence.
Second, on ties sort respecting diacritics, ignoring case.
Third, on ties sort by case.
You can emulate the behavior using javascript locale apis by mimicking each step in turn in a custom compare function, with the exception of the letter-digit inversion in the collation sequence.
Tackle the latter by identifying 10 contiguous code points that do not represent digits and that lie beyond the set of code points that may occur in the strings you are sorting. Map digits onto the the chosen code point range preserving order. When you sort, specify the Unicode collating extension 'direct' which means 'sorting by code point'. Remap after sorting.
In the PoC code below I have chosen some cyrillic characters.
function cmptiered(a,b) {
//
// aka oracle sort
//
return lc_base.compare(a, b) || lc_accent.compare(a, b) || lc_case.compare(a, b);
} // cmptiered
var lc_accent = new Intl.Collator('de', { sensitivity: 'accent' });
var lc_base = new Intl.Collator('de-DE-u-co-direct', { sensitivity: 'base' });
var lc_case = new Intl.Collator('de', { caseFirst: 'lower', sensitivity: 'variant' });
var array = ['Ba12nes','Apfel','Banane','banane','abc','ABC','123','2', null, 'ba998ne' ];
// Map onto substitute code blocks
array = array.map ( function ( item ) { return (item === null) ? null : item.replace ( /[0-9]/g, function (c) { return String.fromCharCode(c.charCodeAt(0) - "0".charCodeAt(0) + "\u0430".charCodeAt(0)); } ); } );
array.sort(cmptiered);
// Remap substitute code point
array = array.map ( function ( item ) { return (item === null) ? null : item.replace ( /[\u0430-\u0439]/g, function (c) { return String.fromCharCode(c.charCodeAt(0) - "\u0430".charCodeAt(0) + "0".charCodeAt(0)); } ); } );
Edit
Function cmptiered streamlined following Nina Scholz' comment.

This proposals feature sorting without use of Intl.Collator. The first solution works with direct sort and comparing the given values.
var array = ['Ba12nes', 'Apfel', 'Banane', 'banane', 'abc', 'ABC', '123', '2', null, 'ba998ne'];
array.sort(function (a, b) {
var i = 0;
if (a === null && b === null) { return 0; }
if (a === null) { return 1; }
if (b === null) { return -1; }
while (i < a.length && i < b.length && a[i].toLocaleLowerCase() === b[i].toLocaleLowerCase()) {
i++;
}
if (isFinite(a[i]) && isFinite(b[i])) { return a[i] - b[i]; }
if (isFinite(a[i])) { return 1; }
if (isFinite(b[i])) { return -1; }
return a.localeCompare(b);
});
document.write(JSON.stringify(array));
The second solution features a different approach, based on Sorting with map and a custom sort scheme which takes a new string. The string is build by this rules:
If the value is null take the string 'null'.
If a character is a decimal, takes the character with space paddded around, eg. if it is 9 take the string ' 9 '.
Otherwise for every other character take two spaces and the character itself, like ' o'.
The new build string is used with a a.value.localeCompare(b.value).
Here are the strings with the mapped values:
' B a 1 2 n e s'
' A p f e l'
' B a n a n e'
' b a n a n e'
' a b c'
' A B C'
' 1 2 3 '
' 2 '
'null'
' b a 9 9 8 n e'
sorted, it became
' a b c'
' A B C'
' A p f e l'
' b a n a n e'
' B a n a n e'
' B a 1 2 n e s'
' b a 9 9 8 n e'
' 1 2 3 '
' 2 '
'null'
var array = ['Ba12nes', 'Apfel', 'Banane', 'banane', 'abc', 'ABC', '123', '2', null, 'ba998ne'],
mapped = array.map(function (el, i) {
var j, o = { index: i, value: '' };
if (el === null) {
o.value = 'null';
return o;
}
for (j = 0; j < el.length; j++) {
o.value += /\d/.test(el[j]) ? ' ' + el[j] + ' ' : ' ' + el[j];
}
return o;
});
mapped.sort(function (a, b) {
return a.value.localeCompare(b.value);
});
var result = mapped.map(function (el) {
return array[el.index];
});
document.write(JSON.stringify(result));

A simple head on solution that works at least for english & russian (mimicking NLS_SORT=RUSSIAN) and doesn't rely on fancy things like Intl.Collator, locales and options that don't exist for IE<11.
function compareStringOracle(str1, str2) {
if (str1 == null && str2 != null)
return 1;
else if (str1 != null && str2 == null)
return -1;
else if (str1 == null && str2 == null)
return 0;
else {
return compareStringCaseInsensitiveDigitsLast(str1, str2) ||
/* upper case wins between otherwise equal values, which can be checked with
a simple binary comparison (at least for eng & rus) */
((str1 < str2) ? -1 : (str1 > str2) ? 1 : 0);
}
}
function compareStringCaseInsensitiveDigitsLast(str1, str2) {
for (var i = 0; i < str1.length; ++i) {
if (i === str2.length)
return 1;
// toLocaleLowerCase is unnecessary for eng & rus
var c1 = str1.charAt(i).toLowerCase();
var c2 = str2.charAt(i).toLowerCase();
var d1 = "0" <= c1 && c1 <= "9";
var d2 = "0" <= c2 && c2 <= "9";
if (!d1 && d2)
return -1;
else if (d1 && !d2)
return 1;
else if (c1 !== c2)
return (c1 < c2) ? -1 : (c1 > c2) ? 1 : 0;
}
if (str1.length < str2.length)
return -1;
else
return 0;
}

Sort array of objects by multiple properties in Javascript

I've been reading similar posts all day but can't figure out how to sort my javascript array by multiple properties.
My array has a 'name' and 'type' property.
To sort by name I now use:
byNameDesc.sort(function (a, b) {
var x = a.name.toLowerCase();
var y = b.name.toLowerCase();
return y < x ? -1 : y > x ? 1 : 0;
});
Works great. I want to enhance this function. If 'name' is 'foo' it should always be on top. And I also want to sort by 'type'.
So 'foo' should always be on top, next sort by 'name' and 'type'.
I tried this:
byNameDefault.sort(function (a, b) {
if (a.name == 'foo') {
return -1;
}
var x = a.type.toLowerCase();
var y = b.type.toLowerCase();
return x < y ? -1 : x > y ? 1 : 0;
});
But that didn't work.
And I have no clue how to sort by 'name' AND 'type'.
Any help is much appreciated.

For multiple sort criteria you proceed from the first to the last criterion:
If the two entries for one criterion are not equal, you can return from the sort function with result -1 or 1. Additionally at the last criterion you also can return 0 for two equal inputs.
Here is an example implementation for your case:
byNameDefault.sort(function (a, b) {
// compare names
var na = a.name.toLowerCase();
var nb = b.name.toLowerCase();
if (na !== nb) {
if (na === 'foo')
return -1;
else if (nb === 'foo')
return 1;
else
return na < nb ? -1 : 1;
}
// compare types
return a.type < b.type ? -1 : a.type > b.type ? 1 : 0;
}

Do this in one expression where the different components are combined with ||; only when one part evaluates to 0, then next one comes into play:
byNameDefault.sort(function (a, b) {
return (b === 'foo') - (a == 'foo') ||
a.name.localeCompare(b.name) ||
a.type.localeCommpare(b.type);
}

Sorting in a dropdown

I'm populating a few drop downs from some JSON, it works as expected at the moment but i'm trying to sort the values in the drop downs. For all my drop downs it works fine, except for one of them which has numbers in, in which case it lists it 1, 10, 12, 2.
Any ideas how i can keep it sorting alphabetically for everything else but get the sort to work with the numeric values too?
Here's my JS (this replicates for each field - probably should try to find a way to make this reuseable):
var populateGenres = _.map(data.genres, function (val) {
return '<option>' + val + '</option>';
}).join();
var target = '#genreField';
$('#genreField').html(populateGenres);
reArrangeSelect(target);
Here's the sort JS:
function reArrangeSelect(target) {
$(target).html($(target + " option").sort(function(a, b) {
return a.text == b.text ? 0 : a.text < b.text ? -1 : 1
}))
}
My HTML is in this format:
<td>
<select id="genreField" class="form-control"></select>
</td>
<td>
<select id="authorField" class="form-control"></select>
</td>

function reArrangeSelect(target) {
$(target).html($(target + " option").sort(function(a, b) {
// u can use that 'getValue' function
// for "a.text == 'some string'" it will return 'some string' (string type),
// for "a.text == '10'" it will return 10 (number type)
var aVal = getValue(a.text);
var bVal = getValue(b.text);
return aVal == bVal ? 0 : aVal < bVal ? -1 : 1;
}));
}
function getValue(val) {
var asNumber = parseFloat(val);
return isNaN(asNumber) ? val : asNumber;
}

You can sort data.genres before running it through the _.map functions:
data.genres.sort(function (a, b) {
a = parseInt(a, 10);
b = parseInt(b, 10);
if(a > b) {
return 1;
} else if(a < b) {
return -1;
} else {
return 0;
}
});
Once you sort the data then run your _.map snippet:
var populateGenres = _.map(data.genres, function (val) {
return '<option>' + val + '</option>';
}).join();
All of your options should now be sorted before you append them to the <select>.
DEMO

Sorting Numbers and Text in Javascript

I am using a jquery drop down table filter plug in for table filters:
https://github.com/rbayliss/Dropdown-Table-Filter
When I have a column in my table that is numerical however, the numbers are sorted as text, e.g. 1, 10, 100, 2, 20, 200 ...
in the code the sorter looks like:
if(options.sortOpt) {
opts.sort(options.sortOptCallback);
}
I think this is a recursive call to:
sortOptCallback: function(a, b) {
return a.text.toLowerCase() > b.text.toLowerCase();
},
how should I amend this so that it will sort numerical fields correctly? I have tried the following:
sortOptCallback: function (a, b) {
if (isNaN(parseInt(a)) || isNaN(parseInt(b))) {
return a.text.toLowerCase() > b.text.toLowerCase();
} else {
return a > b;
}
},
Thanks,

Your attempt is almost correct. The only problem is that you are still comparing the elements as strings after having determined that they are numeric. Furthermore, sort callbacks expect:
A positive number if a > b
A negative number if a < b
Zero if they are equal.
With this in mind, try this callback:
if( a == b) return 0;
var anum = parseInt(a,10);
var bnum = parseInt(b,10);
if( isNaN(anum) || isNaN(bnum)) {
return a.toLowerCase() > b.toLowerCase() ? 1 : -1;
}
return anum > bnum ? 1 : -1;
EDIT: #PaoloMoretti brought my attention to the fact that all your items are numerical. In that case, you can just do this:
return a-b;

How can I add a sort function condition that will sort all the blank entries to the end of the list?

I'm sorting an object array that has a primary contact name, among other things. Sometimes this has a blank value and when I use the function below it sorts it all correctly, but all the blanks go at the top of the list instead of the bottom. I thought that adding the condition shown below would work, but it does not.
this.comparePrimaryContactName = function (a, b)
{
if(a.PrimaryContactName == "") return -1;
return a.PrimaryContactName > b.PrimaryContactName ? 1 : -1;
}
What am I missing?

I usually use something like this:
this.comparePrimaryContactName = function(a, b) {
a = a.PrimaryContactName || '';
b = b.PrimaryContactName || '';
if(a.length == 0 && b.length == 0)
return 0;
else if(a.length == 0)
return 1;
else if(b.length == 0)
return -1;
else if(a > b)
return 1;
else if(a < b)
return -1;
return 0;
}

Comparison functions must be reflective, transitive, and anti-symmetric. Your function does not satisfy these criteria. For example, if two blank entries are compared with each other, you must return 0, not -1.

this.comparePrimaryContactName = function (a, b)
{
var aName = a.PrimaryContactName;
var bName = b.PrimaryContactName;
return aName === bName ? 0 :
aName.length===0 ? -1 :
bName.length===0 ? 1 :
aName > bName ? 1 : -1;
}

Return 1 instead of -1 for blanks.
this.comparePrimaryContactName = function (a, b) {
if (a.PrimaryContactName == b.PrimaryContactName)
return 0;
if(a.PrimaryContactName == "") return 1;
return a.PrimaryContactName > b.PrimaryContactName ? 1 : -1;
}
Your sort function should return 0 if the two are equal, -1 if a comes before b, and 1 if a comes after b.
See the MDN sort doco for more information.