References

Beginner-friendly references for web development, with live, editable examples.

The JavaScript string.localeCompare() method

Method JavaScript All modern browsers Updated
Quick answer

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

Live 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.Collator for better performance.

Frequently asked questions

How do I sort an array of strings alphabetically?
Use 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?
The default sort() compares character codes, so uppercase sorts before lowercase and accented letters land wrong. localeCompare() follows real alphabetical rules.
How do I sort "file2" before "file10"?
Use numeric collation: a.localeCompare(b, undefined, { numeric: true }).
How do I do a case-insensitive string comparison?
Pass { sensitivity: "base" } as the options, or lowercase both strings before comparing.