We Keep Coding

Why does my custom sort() function cannot be accepted in JavaScript?

I tried to upgrade the current custom sort function of JavaScript to create a new order of sorting e.g. (1, 2, 3, 4,..., !##$%^=+, a, A, b, B, c, C)
function getSortOrder(prop) {
return function (a, b) {
if (isSpecialChar(a[prop], 0) || isSpecialChar(b[prop], 0)) {
return sortData(a[prop], b[prop]);
}
if (isNumeric(a[prop], 0) == "number" || isNumeric(b[prop], 0) == "number") {
return getSortNumeric(a[prop], b[prop]);
}
if (isLetter(a[prop], 0) || isLetter(b[prop], 0)) {
return getSortLetter(a[prop], b[prop]);
}
};
}
function getSortLetter(a, b) {
if ((a.charAt(0) === getLowerCase(a, 0)) && (b.charAt(0) === getUpperCase(b, 0))) {
return sortData(a, b);
}
return sortData(a, b);
}
function getSortNumeric(a, b) {
if (typeof a[prop] == "number") {
return (a[prop] - b[prop]);
} else {
return ((a[prop] < b[prop]) ? -1 : ((a[prop] > b[prop]) ? 1 : 0));
}
}
function sortData(a, b) {
if (a.toLowerCase() < b.toLowerCase()) {
return -1;
} else if (a.toLowerCase() > b.toLowerCase()) {
return 1;
} else {
return 0;
}
}
/**
* Function that is used for the ascending order of number
*
*/
const sortNumberData = (a, b) => a.localeCompare(b, 'en', { numeric: true })
// to check if the data has numeric
function isNumeric(str, index) {
let x = /^[0-9]$/.test(str.charAt(index));
console.log(str, x);
return x;
}
// to determine if the data has neither numeric or letter
function isSpecialChar(str, index) {
return !isNumeric(str, index) && !isLetter(str, index);
}
// to specify the order of letter e.g. (jane doe, Jane Doe, john doe, John doe)
function isLetter(str, index) {
return str.charAt(index).length === 1 && str.match(/[a-z]/i);
}
function getLowerCase(str, index) {
return str.charAt(index).toLowerCase();
}
function getUpperCase(str, index) {
return str.charAt(index).toUpperCase();
}
expected result of Json Values:
List of Users:
123Admin
321user
!testAdmin
#adminData
jane doe
Jane Smith
john doe
John Doe
Current results of Json Values:
List of Users:
!testAdmin
#adminData
123Admin
321user
Jane Smith
jane doe
john doe
It still follows the Ascii default order of sort.

The approach suggested by Nina Scholz is more concise, but here is what was wrong with your original code:
Your isLetter function does not return the correct result. Using the RegExp.test method as below would fix that:
function isLetter(str, index) {
return str.charAt(index).length === 1 && /^[a-z]/i.test(str);
}
Your getSortOrder function also does not handle sorting correctly when comparing characters that belong to different groups (special character / number / letter). To fix that, you could change that function to distinguish when the characters are in the same group versus when they are in different groups:
function getSortOrder(a, b) {
if (isNumeric(a, 0) && isNumeric(b, 0)) return sortData(a, b);
if (isSpecialChar(a, 0) && isSpecialChar(b, 0)) return sortData(a, b);
if (isLetter(a, 0) && isLetter(b, 0)) return sortData(a, b);
if (isNumeric(a, 0)) return -1;
if (isLetter(a, 0)) return 1;
if (isSpecialChar(a, 0)) {
if (isNumeric(b, 0)) return 1;
return -1;
}
}
Finally, the sortData function does not distinguish between lower and upper case. It would need to do something like this:
function sortData(a, b) {
const aLower = a[0].toLowerCase();
const bLower = b[0].toLowerCase();
if (aLower === bLower) {
if (a[0] === aLower && b[0] !== bLower) return -1;
if (a[0] !== aLower && b[0] === bLower) return 1;
return 0;
}
if (aLower < bLower) return -1;
if (aLower > bLower) return 1;
return 0;
}

You could take a brute force approach with an string/object for the wanted order.
This appriach iterate each pair of strings and check any character by getting the order until finding different characters.
const
chars = ' 0123456789!##$%^=+abcdefghijklmnopqrstuvwxyz',
order = Object.fromEntries(Array.from(chars, ((c, i) => [c, i + 1]))),
sort = (a, b) => {
for (let i = 0, l = Math.min(a.length, b.length); i < l; i++) {
const r = order[a[i].toLowerCase()] - order[b[i].toLowerCase()];
if (r) return r;
}
return a.length - b.length;
},
sortBy = (fn, k) => (a, b) => fn(a[k], b[k]),
data = [{ name: 'abcd' }, { name: 'abc' }, { name: 'John Doe' }, { name: '!testAdmin' }, { name: '#adminData' }, { name: '123Admin' }, { name: '321user' }, { name: 'Jane Smith' }, { name: 'jane doe' }, { name: 'john doe' }];
data.sort(sortBy(sort, 'name'));
console.log(data);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Here's a function that can be used in a sort.
It starts with finding the index of the first uncommon character between the lower case strings.
Then assigns the order (-1,0,+1) depending on a priority, and then the order of the lower case strings.
function newSort(a, b) {
let lca = a.toLowerCase();
let lcb = b.toLowerCase();
let len = Math.min(a.length, b.length);
let i = 0;
// find index of first uncommon character
while(lca[i] === lcb[i] && i<len) i++;
// what priority do the types of the uncommon character get
let prioA = !lca[i] ? 0 : /^\d/.test(lca[i]) ? 1 : /^[a-z]/.test(lca[i]) ? 3 : 2;
let prioB = !lcb[i] ? 0 : /^\d/.test(lcb[i]) ? 1 : /^[a-z]/.test(lcb[i]) ? 3 : 2;
let order = prioA > prioB ? 1 : prioA < prioB ? -1
: lca > lcb ? 1 : lca < lcb ? -1 : 0;
return order
}
const stringArray = [
"1!a", "1a!", "!1a", "!a1", "a!1", "a1!"
, "Jane Smith" , "jane doe" , "john doe"
, "abcX", "ABC", "DEFy", "defx"
];
let sortedStringArray = stringArray.sort(newSort);
console.log(sortedStringArray);

custom sorting v-data-table with null values last

I have a v-data-table in vueJS that contains some numeric columns and some string columns.
In each column, some of the values are null.
I am trying to create a custom sorting function that will place null values last.
This is what I tried so far:
<v-data-table
:headers="[
{ text: 'Name', value: 'name' },
{ text: 'Date of Birth', value: 'dateofbirth_fmt' },
{ text: 'Team', value: 'team_name' },
{
text: 'dp1 (string)',
value: 'dp1',
},
{
text: 'dp2 (Numeric),
value: 'dp2',
}
]"
:items="filteredPlayersData"
item-key="_id"
class="elevation-1"
:custom-sort="customSort"
/>
and this function
customSort(items, index, isDesc) {
items.sort((a, b) => {
if (!isDesc[0]) {
return (a[index] != null ? a[index] : Infinity) >
(b[index] != null ? b[index] : Infinity)
? 1
: -1;
} else {
return (b[index] != null ? b[index] : -Infinity) >
(a[index] != null ? a[index] : -Infinity)
? 1
: -1;
}
});
return items;
}
It is working for this numeric column (dp1), but not for the string one (dp2).
Any ideas how to get this work?

Your sorting algorithm is not working correctly for strings.
Imagine that your first string is null, and the second one is 'Jelly bean'.
Instead of null value you are trying to compate Infinity with 'Jelly bean'.
This comparison will be false in both cases:
let a = Infinity;
let b = 'Jelly bean';
console.log(a > b);
console.log(a < b);
It'd be better to use another sorting algorithm.
For example, I've adapted an algorithm from this post:
customSort(items, index, isDesc) {
items.sort((a, b) => {
if (a[index] === b[index]) { // equal items sort equally
return 0;
} else if (a[index] === null) { // nulls sort after anything else
return 1;
} else if (b[index] === null) {
return -1;
} else if (!isDesc[0]) { // otherwise, if we're ascending, lowest sorts first
return a[index] < b[index] ? -1 : 1;
} else { // if descending, highest sorts first
return a[index] < b[index] ? 1 : -1;
}
});
return items;
}
You may test this at CodePen. Works fine for both strings and numbers.

Sort Array Object with Multiple Keys: Javascript

Well, I have an array objects with random values,
Ex.
var arr = [
{ id:1001, date:"20-02-2014", Name: 'demo1' },
{ id:1004, date:"13-02-2014", Name: 'demo0' },
{ id:1000, date:"10-02-2014", Name: 'demo14' },
{ id:1004, date:"16-02-2014", Name: 'demo10' },
{ id:1006, date:"22-02-2014", Name: 'demo111' },
{ id:1003, date:"28-02-2014", Name: 'demo16' },
{ id:1000, date:"28-01-2014", Name: 'demo12' },
{ id:1004, date:"28-01-2014", Name: 'demo01' },
{ id:1000, date:"08-01-2014", Name: 'demo41' },
{ id:1006, date:"08-01-2014", Name: 'demo91' }
]
I wanted to sort this array firstly by key id & then by key date as,
Output:
sorted_arr = [
{"id":1000,"date":"08-01-2014","Name":"demo41"}, //group1
{"id":1000,"date":"28-01-2014","Name":"demo12"}, //group1
{"id":1000,"date":"10-02-2014","Name":"demo14"}, //group1
{"id":1001,"date":"20-02-2014","Name":"demo1"}, //group2
{"id":1003,"date":"28-02-2014","Name":"demo16"}, //group3
{"id":1004,"date":"28-01-2014","Name":"demo01"}, //group4
{"id":1004,"date":"13-02-2014","Name":"demo0"}, //group4
{"id":1004,"date":"16-02-2014","Name":"demo10"}, //group4
{"id":1006,"date":"08-01-2014","Name":"demo91"} //group5
{"id":1006,"date":"22-02-2014","Name":"demo111"} //group5
]
I tried few generic code to sort,
// generic comparison function
cmp = function(x, y){
return x > y ? 1 : x < y ? -1 : 0;
};
arr.sort(function(a, b){
return cmp(
[cmp(a.id, b.id), cmp(a.date, b.date)],
[cmp(b.id, a.id), cmp(b.date, a.date)]
);
});
I referred few examples SO Example but not getting expected output. Please suggest me best way to get this.

No need to create Date objects, just reorder the date string into a sortable string, example
This example assumes that your dates are in the same format DD-MM-YYYY and creates YYYYMMDD for the date sort.
Javascript
var arr = [
{ id:1001, date:"20-02-2014", Name: 'demo1' },
{ id:1004, date:"13-02-2014", Name: 'demo0' },
{ id:1000, date:"10-02-2014", Name: 'demo14' },
{ id:1004, date:"16-02-2014", Name: 'demo10' },
{ id:1006, date:"22-02-2014", Name: 'demo111' },
{ id:1003, date:"28-02-2014", Name: 'demo16' },
{ id:1000, date:"28-01-2014", Name: 'demo12' },
{ id:1004, date:"28-01-2014", Name: 'demo01' },
{ id:1000, date:"08-01-2014", Name: 'demo41' },
{ id:1006, date:"08-01-2014", Name: 'demo91' }
];
var sorted = arr.sort(function (a, b) {
return a.id - b.id || a.date.split('-').reverse().join('') - b.date.split('-').reverse().join('');
});
sorted.forEach(function (element) {
console.log(JSON.stringify(element));
});
Output
{"id":1000,"date":"08-01-2014","Name":"demo41"}
{"id":1000,"date":"28-01-2014","Name":"demo12"}
{"id":1000,"date":"10-02-2014","Name":"demo14"}
{"id":1001,"date":"20-02-2014","Name":"demo1"}
{"id":1003,"date":"28-02-2014","Name":"demo16"}
{"id":1004,"date":"28-01-2014","Name":"demo01"}
{"id":1004,"date":"13-02-2014","Name":"demo0"}
{"id":1004,"date":"16-02-2014","Name":"demo10"}
{"id":1006,"date":"08-01-2014","Name":"demo91"}
{"id":1006,"date":"22-02-2014","Name":"demo111"}
On jsFiddle
If there is any concern over mixing date formats, as discussed with #xdazz, then you can improve on this by checking the padding yourself. The following creates the format 'YYYYYYMMDD' when sorting by the date. The extra year padding is not necessary in this example as I am taking the numeric difference of the values, but if you choose to compare the strings then it is important.
function pad(s, n) {
var v = '',
i;
for(i = 0; i < n - s.length; i += 1) {
v += '0';
}
return v + s;
}
var sorted = arr.sort(function (a, b) {
var idDiff = a.id - b.id;
if (idDiff) {
return idDiff;
}
var ordA = a.date.split('-').reverse(),
ordB = b.date.split('-').reverse();
ordA[0] = pad(ordA[0], 6);
ordA[1] = pad(ordA[1], 2);
ordA[2] = pad(ordA[2], 2);
ordA = ordA.join('');
ordB[0] = pad(ordB[0], 6);
ordB[1] = pad(ordB[1], 2);
ordB[2] = pad(ordB[2], 2);
ordB = ordB.join('');
return ordA - ordB;
});
On jsFiddle
If you really want to use Date objects the I would suggest the following.
var sorted = arr.sort(function (a, b) {
var idDiff = a.id - b.id;
if (idDiff) {
return idDiff;
}
var ordA = a.date.split('-').reverse(),
ordB = b.date.split('-').reverse();
ordA[1] -= 1;
ordB[1] -= 1;
return new Date(Date.UTC.apply(undefined, ordA)).valueOf() - new Date(Date.UTC.apply(undefined, ordB)).valueOf();
});
sorted.forEach(function (element) {
console.log(JSON.stringify(element));
});
On jsFiddle
Note: These examples do not handle dates with negative years, again you would need to make further modifications.

First compare with id, then compare with date if id equal. But because your date is in invalid date format, extra work has to be done for letting it be recognized by Date.
sorted_arr = arr.sort(function(a, b) {
return a.id - b.id || new Date(a.date.split('-').reverse().join('-')) - new Date(b.date.split('-').reverse().join('-'));
});
Edit:
If you are guaranteed to have zeros in front of the 1-digit months and dates, then you could even not to parse to date:
sorted_arr = arr.sort(function(a, b) {
return a.id - b.id || a.date.split('-').reverse().join('') - b.date.split('-').reverse().join('');
});

It's better to have a date operate lib momentjs to help.
You could check the code on jsBin
function compare(a, b){
var idDiff = a.id - b.id;
var adate = moment(a.date, "DD-MM-YYYY");
var bdate = moment(b.date, "DD-MM-YYYY");
var dateDiff = adate.diff(bdate);
return idDiff || dateDiff;
}
var sortedArr = arr.sort(compare);
console.log(sortedArr);

You can sort array by two properties with Alasql library:
var res = alasql('SELECT *, mid(date,7,4)+mid(date,4,2)+mid(date,1,2) AS ndate \
FROM ? ORDER BY id, ndate',[arr]);
Try this example at jsFiddle.
Here "mid(date,7,4)+mid(date,4,2)+mid(date,1,2)" was used to convert date from '28-11-2014' to the sort key like '20141128'.

Came up with this using underscore.js & it's chain and sortBy:
var sorted_array = _(arr).chain().sortBy(function(o) {
return o.date.split('-').reverse().join();
}).sortBy(function(o) {
return o.id;
}).value();
Sorting on the date first, and then id will give you the list sorted as expected.
jsfiddle

Sort multidimensional JSON array

I have following array from facebook graph API.
I want to sort it by comment_count, like_count, time in javascript.
[
{
"status_id": "1",
"message": "message1",
"comment_info": {
"comment_count": "1"
},
"like_info": {
"like_count": "0"
},
"time": "1380046653"
},
{
"status_id": "2",
"message": "message2",
"comment_info": {
"comment_count": "2"
},
"like_info": {
"like_count": "5"
},
"time": "1368109884"
}
]
I wrote function like below,
function sortResults(prop, asc) {
statusString = statusString.sort(function(a, b) {
if (asc) return (a[prop] > b[prop]) ? 1 : ((a[prop] < b[prop]) ? -1 : 0);
else return (b[prop] > a[prop]) ? 1 : ((b[prop] < a[prop]) ? -1 : 0);
});
console.log(statusString);
}
And on button click
sortResults(['comment_info']['comment_count'], true);
But it sorts weiredly.

Your function didnt' take in consideration multi dimensional sort which needs to access deep property of nested arrays.
Here is a working example JSFIDLE link (click here)
var jSon = [{"status_id":"1","message":"message1","comment_info":{"comment_count":"1"},"like_info":{"like_count":"0"},"time":"1380046653"},{"status_id":"2","message":"message2","comment_info":{"comment_count":"2"},"like_info":{"like_count":"5"},"time":"1368109884"}];
// Function that sorts arr Array
// by prop (handling custom Fb cases)
// in dir direction (asc/desc)
function sortJson(arr, prop, dir) {
return arr.sort(function(a,b) {
var propA,propB;
if (prop == "comment_count") {
propA = a['comment_info']['comment_count'];
propB = b['comment_info']['comment_count'];
} else if (prop == "like_count") {
propA = a['like_info']['like_count'];
propB = b['like_info']['like_count'];
} else {
propA = a[prop];
propB = b[prop];
}
if (dir=='asc') {
return propA - propB;
} else {
return propB - propA;
}
});
}
console.log( sortJson(jSon, 'time', 'asc') );
console.log( sortJson(jSon, 'comment_count', 'asc') );
console.log( sortJson(jSon, 'like_count', 'desc').toString() );

You probably need sort function from native [].
[].sort(compareFunction)
example from here :
function compare(a, b) {
if (a is less than b by some ordering criterion)
return -1;
if (a is greater than b by the ordering criterion)
return 1;
// a must be equal to b
return 0;
}

let's say your order in the sort is as you have mentioned them:
var arr = [{"status_id":"1","message":"message1","comment_info":{"comment_count":"1"},"like_info":{"like_count":"0"},"time":"1380046653"},{"status_id":"2","message":"message2","comment_info":{"comment_count":"2"},"like_info":{"like_count":"5"},"time":"1368109884"}];
arr.sort(function (a, b) {
var countA = parseInt(a["comment_info"]["comment_count"]);
var countB = parseInt(b["comment_info"]["comment_count"]);
var likeCountA = parseInt(a["like_info"]["like_count"]);
var likeCountB = parseInt(b["like_info"]["like_count"]);
var timeA = a["time"];
var timeB = b["time"];
return ((countA - countB) || (likeCountA - likeCountB) || (timeA - timeB));
});

Javascript sort function. Sort by First then by Second

I have an array of objects to sort. Each object has two parameters: Strength and Name
objects = []
object[0] = {strength: 3, name: "Leo"}
object[1] = {strength: 3, name: "Mike"}
I want to sort first by Strength and then by name alphabetically. I am using the following code to sort by the first parameter. How do I sort then by the second?
function sortF(ob1,ob2) {
if (ob1.strength > ob2.strength) {return 1}
else if (ob1.strength < ob2.strength){return -1}
return 0;
};
Thanks for your help.
(I am using Array.sort() with the aforementioned sortF as the sort comparison function passed into it.)

Expand your sort function to be like this;
function sortF(ob1,ob2) {
if (ob1.strength > ob2.strength) {
return 1;
} else if (ob1.strength < ob2.strength) {
return -1;
}
// Else go to the 2nd item
if (ob1.name < ob2.name) {
return -1;
} else if (ob1.name > ob2.name) {
return 1
} else { // nothing to split them
return 0;
}
}
A < and > comparison on strings is an alphabetic comparison.

This little function is often handy when sorting by multiple keys:
cmp = function(a, b) {
if (a > b) return +1;
if (a < b) return -1;
return 0;
}
or, more concisely,
cmp = (a, b) => (a > b) - (a < b)
Which works because in javascript:
true - true // gives 0
false - false // gives 0
true - false // gives 1
false - true // gives -1
Apply it like this:
array.sort(function(a, b) {
return cmp(a.strength,b.strength) || cmp(a.name,b.name)
})
Javascript is really missing Ruby's spaceship operator, which makes such comparisons extremely elegant.

You could chain the sort order with logical OR.
objects.sort(function (a, b) {
return a.strength - b.strength || a.name.localeCompare(b.name);
});

When I was looking for an answer to this very question, the answers I found on StackOverflow weren't really what I hoped for. So I created a simple, reusable function that does exactly this. It allows you to use the standard Array.sort, but with firstBy().thenBy().thenBy() style.
https://github.com/Teun/thenBy.js
PS. This is the second time I post this. The first time was removed by a moderator saying "Please don't make promotional posts for your own work". I'm not sure what the rules are here, but I was trying to answer this question. I'm very sorry that it is my own work. Feel free to remove again, but please point me to the rule involved then.

steve's answer, but prettier.
objects.sort(function(a,b)
{
if(a.strength > b.strength) {return 1;}
if(a.strength < b.strength) {return -1;}
if(a.name > b.name ) {return 1;}
if(a.name < b.name ) {return -1;}
return 0;
}

function sortF(ob1,ob2) {
if (ob1.strength > ob2.strength) {return 1}
else if (ob1.strength < ob2.strength) {return -1}
else if (ob1.name > ob2.name) {return 1}
return -1;
};
EDIT: Sort by strength, then if strength is equal, sort by name.
The case where strength and name are equal in both objects doesn't need to be accounted for seperately, since the final return of -1 indicates a less-than-or-equal-to relationship. The outcome of the sort will be correct. It might make it run faster or slower, I don't know. If you want to be explicit, just replace
return -1;
with
else if (ob1.name < ob2.name) {return -1}
return 0;

Find 'sortFn' function below. This function sorts by unlimited number of parameters(such as in c#: SortBy(...).ThenBy(...).ThenByDesc(...)).
function sortFn() {
var sortByProps = Array.prototype.slice.call(arguments),
cmpFn = function(left, right, sortOrder) {
var sortMultiplier = sortOrder === "asc" ? 1 : -1;
if (left > right) {
return +1 * sortMultiplier;
}
if (left < right) {
return -1 * sortMultiplier;
}
return 0;
};
return function(sortLeft, sortRight) {
// get value from object by complex key
var getValueByStr = function(obj, path) {
var i, len;
//prepare keys
path = path.replace('[', '.');
path = path.replace(']', '');
path = path.split('.');
len = path.length;
for (i = 0; i < len; i++) {
if (!obj || typeof obj !== 'object') {
return obj;
}
obj = obj[path[i]];
}
return obj;
};
return sortByProps.map(function(property) {
return cmpFn(getValueByStr(sortLeft, property.prop), getValueByStr(sortRight, property.prop), property.sortOrder);
}).reduceRight(function(left, right) {
return right || left;
});
};
}
var arr = [{
name: 'marry',
LocalizedData: {
'en-US': {
Value: 10000
}
}
}, {
name: 'larry',
LocalizedData: {
'en-US': {
Value: 2
}
}
}, {
name: 'marry',
LocalizedData: {
'en-US': {
Value: 100
}
}
}, {
name: 'larry',
LocalizedData: {
'en-US': {
Value: 1
}
}
}];
document.getElementsByTagName('pre')[0].innerText = JSON.stringify(arr)
arr.sort(sortFn({
prop: "name",
sortOrder: "asc"
}, {
prop: "LocalizedData[en-US].Value",
sortOrder: "desc"
}));
document.getElementsByTagName('pre')[1].innerText = JSON.stringify(arr)
pre {
font-family: "Courier New" Courier monospace;
white-space: pre-wrap;
}
Before:
<pre></pre>
Result:
<pre></pre>

With ES6 you can do
array.sort(function(a, b) {
return SortFn(a.strength,b.strength) || SortFn(a.name,b.name)
})
private sortFn(a, b): number {
return a === b ? 0 : a < b ? -1 : 1;
}

Here is the function I use. It will do an arbitrary number.
function Sorter(){
var self = this;
this.sortDefs = [];
for (let i = 0; i < arguments.length; i++) {
// Runs 5 times, with values of step 0 through 4.
this.sortDefs.push(arguments[i]);
}
this.sort = function(a, b){
for (let i = 0; i < self.sortDefs.length; i++) {
if (a[self.sortDefs[i]] < b[self.sortDefs[i]]) {
return -1;
} else if (a[self.sortDefs[i]] > b[self.sortDefs[i]]) {
return 1
}
}
return 0;
}
}
data.sort(new Sorter('category','name').sort);

In 2018 you can use just sort() ES6 function, that do exactly, what you want.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort