Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it better to compare strings using toLowerCase or toUpperCase in JavaScript?

I'm going through a code review and I'm curious if it's better to convert strings to upper or lower case in JavaScript when attempting to compare them while ignoring case.

Trivial example:

var firstString = "I might be A different CASE";
var secondString = "i might be a different case";
var areStringsEqual = firstString.toLowerCase() === secondString.toLowerCase();

or should I do this:

var firstString = "I might be A different CASE";
var secondString = "i might be a different case";
var areStringsEqual = firstString.toUpperCase() === secondString.toUpperCase();

It seems like either "should" or would work with limited character sets like only English letters, so is one more robust than the other?

As a note, MSDN recommends normalizing strings to uppercase, but that is for managed code (presumably C# & F# but they have fancy StringComparers and base libraries):

http://msdn.microsoft.com/en-us/library/bb386042.aspx

like image 970
Josh R Avatar asked Nov 12 '14 01:11

Josh R


People also ask

Why do we use toLowerCase in JavaScript?

The toLowerCase() method converts the string specified into a new one that consists of only lowercase letters and returns that value. It means that the old, original string is not changed or affected in any way.

Does toLowerCase change the string JavaScript?

The toLowerCase() method converts a string to lowercase letters. The toLowerCase() method does not change the original string.

How do you compare strings in JavaScript?

To compare two strings in JavaScript, use the localeCompare() method. The method returns 0 if both the strings are equal, -1 if string 1 is sorted before string 2 and 1 if string 2 is sorted before string 1.

What is the difference between toUpperCase and toLocaleUpperCase?

Definition and Usage The toLocaleUpperCase() method does not change the original string. The toLocaleUpperCase() returns the same result as toUpperCase() , except for locales that conflict with the regular Unicode case mappings (such as Turkish).


2 Answers

Revised answer

It's been quite a while when I answered this question. While cultural issues still holds true (and I don't think they will ever go away), the development of ECMA-402 standard made my original answer... outdated (or obsolete?).

The best solution for comparing localized strings seems to be using function localeCompare() with appropriate locales and options:

var locale = 'en'; // that should be somehow detected and passed on to JS
var firstString = "I might be A different CASE";
var secondString = "i might be a different case";
if (firstString.localeCompare(secondString, locale, {sensitivity: 'accent'}) === 0) {
    // do something when equal
}

This will compare two strings case-insensitive, but accent-sensitive (for example ą != a).
If this is not sufficient for performance reasons, you may want to use either
toLocaleUpperCase()ortoLocaleLowerCase()` passing the locale as a parameter:

if (firstString.toLocaleUpperCase(locale) === secondString.toLocaleUpperCase(locale)) {
    // do something when equal
}

In theory there should be no differences. In practice, subtle implementation details (or lack of implementation in the given browser) may yield different results...

Original answer

I am not sure if you really meant to ask this question in Internationalization (i18n) tag, but since you did...
Probably the most unexpected answer is: neither.

There are tons of problems with case conversion, which inevitably leads to functional issues if you want to convert the character case without indicating the language (like in JavaScript case). For instance:

  1. There are many natural languages that don't have concept of upper- and lowercase characters. No point in trying to convert them (although this will work).
  2. There are language specific rules for converting the string. German sharp S character (ß) is bound to be converted into two upper case S letters (SS).
  3. Turkish and Azerbaijani (or Azeri if you prefer) has "very strange" concept of two i characters: dotless ı (which converts to uppercase I) and dotted i (which converts to uppercase İ <- this font does not allow for correct presentation, but this is really different glyph).
  4. Greek language has many "strange" conversion rules. One particular rule regards to uppercase letter sigma (Σ) which depending on a place in a word has two lowercase counterparts: regular sigma (σ) and final sigma (ς). There are also other conversion rules in regard to "accented" characters, but they are commonly omitted during implementation of conversion function.
  5. Some languages has title-case letters, i.e. Lj which should be converted to things like LJ or less appropriately LJ. The same may regard to ligatures.
  6. Finally there are many compatibility characters that may mean the same as what you are trying to compare to, but be composed of completely different characters. To make it worse, things like "ae" may be the equivalent of "ä" in German and Finnish, but equivalent of "æ" in Danish.

I am trying to convince you that it is really better to compare user input literally, rather than converting it. If it is not user-related, it probably doesn't matter, but case conversion will always take time. Why bother?

like image 143
Paweł Dyda Avatar answered Oct 15 '22 09:10

Paweł Dyda


Some other options have been presented, but if you must use toLowerCase, or toUpperCase, I wanted some actual data on this. I pulled the full list of two byte characters that fail with toLowerCase or toUpperCase. I then ran this test:

let pairs = [
[0x00E5,0x212B],[0x00C5,0x212B],[0x0399,0x1FBE],[0x03B9,0x1FBE],[0x03B2,0x03D0],
[0x03B5,0x03F5],[0x03B8,0x03D1],[0x03B8,0x03F4],[0x03D1,0x03F4],[0x03B9,0x1FBE],
[0x0345,0x03B9],[0x0345,0x1FBE],[0x03BA,0x03F0],[0x00B5,0x03BC],[0x03C0,0x03D6],
[0x03C1,0x03F1],[0x03C2,0x03C3],[0x03C6,0x03D5],[0x03C9,0x2126],[0x0392,0x03D0],
[0x0395,0x03F5],[0x03D1,0x03F4],[0x0398,0x03D1],[0x0398,0x03F4],[0x0345,0x1FBE],
[0x0345,0x0399],[0x0399,0x1FBE],[0x039A,0x03F0],[0x00B5,0x039C],[0x03A0,0x03D6],
[0x03A1,0x03F1],[0x03A3,0x03C2],[0x03A6,0x03D5],[0x03A9,0x2126],[0x0398,0x03F4],
[0x03B8,0x03F4],[0x03B8,0x03D1],[0x0398,0x03D1],[0x0432,0x1C80],[0x0434,0x1C81],
[0x043E,0x1C82],[0x0441,0x1C83],[0x0442,0x1C84],[0x0442,0x1C85],[0x1C84,0x1C85],
[0x044A,0x1C86],[0x0412,0x1C80],[0x0414,0x1C81],[0x041E,0x1C82],[0x0421,0x1C83],
[0x1C84,0x1C85],[0x0422,0x1C84],[0x0422,0x1C85],[0x042A,0x1C86],[0x0463,0x1C87],
[0x0462,0x1C87]
];

let upper = 0, lower = 0;
for (let pair of pairs) {
   let row = 'U+' + pair[0].toString(16).padStart(4, '0') + ' ';
   row += 'U+' + pair[1].toString(16).padStart(4, '0') + ' pass: ';
   let s = String.fromCodePoint(pair[0]);
   let t = String.fromCodePoint(pair[1]);
   if (s.toUpperCase() == t.toUpperCase()) {
      row += 'toUpperCase ';
      upper++;
   } else {
      row += '            ';
   }
   if (s.toLowerCase() == t.toLowerCase()) {
      row += 'toLowerCase';
      lower++;
   }
   console.log(row);
}
console.log('upper pass: ' + upper + ', lower pass: ' + lower);

Interestingly, one of the pairs fails with both. But based on this, toUpperCase is the best option.

like image 32
Zombo Avatar answered Oct 15 '22 08:10

Zombo