The JavaScript string.localeCompare() method
The localeCompare() method compares two strings in locale order and returns a negative number, 0, or a positive number — exactly the shape a sort() compare function needs. arr.sort((a, b) => a.localeCompare(b)) sorts strings alphabetically, correctly handling accents and case.
Overview
localeCompare() compares two strings the way a human expects, in the current locale. a.localeCompare(b) returns a negative number if a sorts before b, 0 if they're equivalent, and a positive number if a sorts after — which is precisely the contract a sort() compare function expects.
That makes it the right way to sort strings alphabetically: names.sort((a, b) => a.localeCompare(b)). Why not just use < or the default sort? Because the default sorts by character code, which gets accented letters and mixed case wrong — uppercase letters sort before all lowercase, and "é" ends up in the wrong place. localeCompare() follows real language rules instead.
It takes optional arguments for fine control: a locales string and an options object. With options you can do case-insensitive or accent-insensitive comparison ({ sensitivity: "base" }) or treat embedded numbers numerically ({ numeric: true }, so "file2" sorts before "file10"). For sorting large lists, Intl.Collator is a faster reusable alternative.
Syntax
a.localeCompare(b)
a.localeCompare(b, locales, options)
"a".localeCompare("b") // negative (a before b)
names.sort((a, b) => a.localeCompare(b)) // alphabetical sort
"file2".localeCompare("file10", undefined, { numeric: true }) // negative
Parameters
The string.localeCompare() method accepts the following parameters.
| Parameter | Description |
|---|---|
compareString |
The string to compare against. |
locales |
Optional. A BCP 47 locale string (e.g. "en") for language-specific ordering. |
options |
Optional. Settings like sensitivity and numeric. |
Example
<pre id="out" style="font:15px ui-monospace,monospace"></pre>
<script>
const names = ['banana', 'Apple', 'cherry'];
const byCode = [...names].sort();
const byLocale = [...names].sort((a, b) => a.localeCompare(b));
document.getElementById('out').textContent =
'default: ' + byCode.join(', ') + '\n' +
'locale: ' + byLocale.join(', ');
// default: Apple, banana, cherry / locale: Apple, banana, cherry
</script>
Best practices
- Sort strings with
arr.sort((a, b) => a.localeCompare(b))for correct alphabetical order. - Use
{ numeric: true }so"file2"sorts before"file10". - Use
{ sensitivity: "base" }for case- and accent-insensitive comparison. - For sorting big lists, create a reusable
Intl.Collatorfor better performance.
Frequently asked questions
How do I sort an array of strings alphabetically?
arr.sort((a, b) => a.localeCompare(b)), which orders strings by language rules including accents and case.Why not just sort strings with the default sort?
localeCompare() follows real alphabetical rules.How do I sort "file2" before "file10"?
a.localeCompare(b, undefined, { numeric: true }).How do I do a case-insensitive string comparison?
{ sensitivity: "base" } as the options, or lowercase both strings before comparing.