Pfthb

I have the following array of objects:

const myList = [
 id: 1, title: '[A] Animal Bite - F - Not Pregnant' ,
 id: 2, title: '[P] Sinus Pain - M' ,
 id: 3, title: '[A] Animal Bite - F - Pregnant' ,
 id: 4, title: 'Check up male' ,
 id: 5, title: '[A] Animal Bite - M' ,
 id: 6, title: 'Duration' ,
 id: 7, title: '[P] Skin Injury - F - Not Pregnant' ,
 id: 8, title: '[P] Skin Injury - M' ,
 id: 9, title: 'Emergency Screening' 
]

After doing:

_.sortBy(myList, 'title');

I get:

Check up male
Duration
Emergency Screening
[A] Animal Bite - F - Not Pregnant
[A] Animal Bite - F - Pregnant
[A] Animal Bite - M
[P] Sinus Pain - M
[P] Skin Injury - F - Not Pregnant
[P] Skin Injury - M

It looks good except I want the items without [A] or [P] to be at the bottom instead of the top. So like this instead:

[A] Animal Bite - F - Not Pregnant
[A] Animal Bite - F - Pregnant
[A] Animal Bite - M
[P] Sinus Pain - M
[P] Skin Injury - F - Not Pregnant
[P] Skin Injury - M
Check up male
Duration
Emergency Screening

How to achieve this?

Use localeCompare with numeric: false option in the sort function:

const list = [ id: 1, title: '[A] Animal Bite - F - Not Pregnant' , id: 2, title: '[P] Sinus Pain - M' , id: 3, title: '[A] Animal Bite - F - Pregnant' , id: 4, title: 'Check up male' , id: 5, title: '[A] Animal Bite - M' , id: 6, title: 'Duration' , id: 7, title: '[P] Skin Injury - F - Not Pregnant' , id: 8, title: '[P] Skin Injury - M' , id: 9, title: 'Emergency Screening' ] 

const r = list.sort((a,b) => a.title.localeCompare(b.title, 0, numeric: false))

console.log(r)

Another way you can also get the same result is via the caseFirst: lower' option parameter as noted (and explained) by @xehpuk asnwer:

const list = [ id: 1, title: '[A] Animal Bite - F - Not Pregnant' , id: 2, title: '[P] Sinus Pain - M' , id: 3, title: '[A] Animal Bite - F - Pregnant' , id: 4, title: 'Check up male' , id: 5, title: '[A] Animal Bite - M' , id: 6, title: 'Duration' , id: 7, title: '[P] Skin Injury - F - Not Pregnant' , id: 8, title: '[P] Skin Injury - M' , id: 9, title: 'Emergency Screening' ] 

const r = list.sort((a,b) => a.title.localeCompare(b.title, 0, caseFirst: 'lower'))

console.log(r)

You also do not need lodash for this if ES6 is an option.

lodash's sortBy may take list of comparators. So you can just declare "words don't start from square bracket go later" and inside the "group" sort by title

_.sortBy(myList, [
 item => !item.title.startsWith("["), 
 'title'
]);

And with orderBy you even can specify ordering in more readable(and flexible) way:

_.orderBy(myList, [
 item => item.title.startsWith("["), 
 'title'
], ['desc', 'asc']);

[UPD] with startsWith mentioned by @Ele it looks even better

If you really want to use lodash, you can compare the titles in lower-case:

_.sortBy(myList, item => item.title.toLowerCase());

This works because the code unit of the lower-case characters (97 - 122) is greater than the one of [ (91). This would also have the benefit of comparing the titles case-insensitively.

This is an alternative using the function Array.prototype.sort()

Assuming the there is max one [ in the string.

const myList = [ id: 1, title: '[A] Animal Bite - F - Not Pregnant' , id: 2, title: '[P] Sinus Pain - M' , id: 3, title: '[A] Animal Bite - F - Pregnant' , id: 4, title: 'Check up male' , id: 5, title: '[A] Animal Bite - M' , id: 6, title: 'Duration' , id: 7, title: '[P] Skin Injury - F - Not Pregnant' , id: 8, title: '[P] Skin Injury - M' , id: 9, title: 'Emergency Screening' ];

myList.sort((a, b) => 
 if (a.title.startsWith("[") && b.title.startsWith("[")) 
 return a.title.substring(1).localeCompare(b.title.substring(1)); 
 
 
 return a.title.localeCompare(b.title);
);

console.log(myList);

.as-console-wrapper max-height: 100% !important; top: 0; 

You could move the brackets parts to top by checking the strings, then takes the local compare result.

const
 startsWithBrackets = s => /^[.+]/.test(s),
 myList = [ id: 1, title: '[A] Animal Bite - F - Not Pregnant' , id: 2, title: '[P] Sinus Pain - M' , id: 3, title: '[A] Animal Bite - F - Pregnant' , id: 4, title: 'Check up male' , id: 5, title: '[A] Animal Bite - M' , id: 6, title: 'Duration' , id: 7, title: '[P] Skin Injury - F - Not Pregnant' , id: 8, title: '[P] Skin Injury - M' , id: 9, title: 'Emergency Screening' ];

myList.sort(( title: a , title: b ) =>
 startsWithBrackets(b) - startsWithBrackets(a) || a.localeCompare(b));

console.log(myList);

.as-console-wrapper max-height: 100% !important; top: 0;