Introduction to JavaScript toLowercase()
Javascript provides us with many properties and methods for string object manipulation. We can use them to get the resultant value according to our necessities and requirements. One of the methods available for string manipulation in javascript is the toLowerCase() method, which converts the string object using which it is called to its equivalent value but in lower case of alphabets.
For example,
When I declare a variable named sample and initialize it with the value “Hello Students” and then call toLowerCase() method using sample object, then it returns me a string object with value “hello students” that is all alphabets in it will be in lower case. Here are the code and output for the same.
Code:
<!DOCTYPE html>
<html>
<body>
<p>Please Click the button to get lowercase letters in the string. </p>
<button onclick="covertToLower()">Try it</button>
<p id="showSample"></p>
<script>
function covertToLower() {
var sample = "Hello Students";
var result = sample.toLowerCase(); document.getElementById("showSample").innerHTML = result;
}
</script>
</body>
</html>Output:
After clicking the button “Try It”, it will display the string in lower case as the output.
Variants of toLowerCase() method in JavaScript
Below we have to explain variants of JavaScript toLowercase() methods:
- public String toLowerCase(): This method works the same as the toLocaleLowerCase() method. It considers the default locale as English.
- Public String toLocaleLowerCase(): The locale is based on the language settings of the browser and may vary sometimes like Turkey, Greek, etc. This method results in the same result in lower cases and varies for some of the characters for different locales like I without the dot in the Turkish language. It considers the default locale as the computer’s current locale.
Example to Implement JavaScript toLowercase()
Below are the explanations for the program to implement:
toLocaleLowerCase()
Code:
<!DOCTYPE html>
<html>
<body>
<p>To convert the string into lowercase according to your browser's current locale click on the button</p>
<button onclick="covertToLower()">Convert</button>
<p id="sampleDemo"></p>
<script>
function covertToLower() {
var tempString = "JavascriPt Coders";
var result = tempString.toLocaleLowerCase(); document.getElementById("sampleDemo").innerHTML = result;
}
</script>
</body>
</html>Output:
As my current browser’s default language is English, the output of toLowerCaseLocale() was similar to toLowerCase(). It would have been different if the browser’s current locale would be different, like Turkey, Greek or else.
Internal Details of toLowerCase() Method Work
- Internally, the string is converted to a character array, and then each character is compared and converted to the required.
- Finally, after the final array is formed containing all the desired characters in lower case, it is converted to a string, and new string is
- Hence, it is necessary to remember that the original string object supplied to this method is not changed or modified; instead, a new string object is created and returned.
Code:
public String toLowerCase(Locale locale) { if (locale == null) {
throw new NullPointerException();
}
int initialUpperChar;
final int stringLength = value.length;
/* Check if there are any characters whose case needs to be changed. */ scan: {
for (initialUpperChar = 0 ; initialUpperChar < stringLength; ) { char c = value[initialUpperChar];
if ((c >= Character.MIN_HIGH_SURROGATE)
&& (c <= Character.MAX_HIGH_SURROGATE)) { int currentChar = codePointAt(initialUpperChar);
if (currentChar != Character.toLowerCase(currentChar)) { break scan;
}
initialUpperChar += Character.charCount(currentChar);
if (c != Character.toLowerCase(c)) { break scan;
}
initialUpperChar++;
}
}
return this;
}
char[] result = new char[stringLength]; int offsetOfResult = 0;
/* result may grow, so i+offsetOfResult is the write location in result */
/* Now copy the first few characters in lowerCase. */ System.arraycopy(value, 0, result, 0, initialUpperChar);
"lt");
String targetLanguage = locale.getLanguage(); boolean isLocaleDependent =
(targetLanguage == "tr" || targetLanguage == "az" || targetLanguage ==
char[] lowerCharacterArray; int lowerChar;
int sourceChar; int sourceCount;
for (int i = initialUpperChar; i < stringLength; i += sourceCount) { sourceChar = (int)value[i];
if ((char)sourceChar >= Character.MIN_HIGH_SURROGATE
&& (char)sourceChar <= Character.MAX_HIGH_SURROGATE) { sourceChar = codePointAt(i);
sourceCount = Character.charCount(sourceChar);
sourceCount = 1;
}
SIGMA
if (isLocaleDependent || sourceChar == '\u03A3') { // GREEK CAPITAL LETTER
lowerChar = ConditionalSpecialCasing.toLowerCaseEx(this, i, locale);
} else if (sourceChar == '\u0130') { // LATIN CAPITAL LETTER I DOT lowerChar = Character.ERROR;
} else {
lowerChar = Character.toLowerCase(sourceChar);
}
if ((lowerChar == Character.ERROR)
|| (lowerChar >= Character.MIN_SUPPLEMENTARY_CODE_POINT)) { if (lowerChar == Character.ERROR) {
if (!isLocaleDependent && sourceChar == '\u0130') { lowerCharacterArray =
ConditionalSpecialCasing.toLowerCaseCharArray(this, i,
Locale.ENGLISH);
} else {
lowerCharacterArray = ConditionalSpecialCasing.toLowerCaseCharArray(this, i, locale);
}
} else if (sourceCount == 2) {
offsetOfResult += Character.toChars(lowerChar, result, i + offsetOfResult) - sourceCount;
continue;
} else {
lowerCharacterArray = Character.toChars(lowerChar);
}
/* Grow the size of the result if required */
int mapstringLength = lowerCharacterArray.length; if (mapstringLength > sourceCount) {
char[] result2 = new char[result.length + mapstringLength - sourceCount]; System.arraycopy(result, 0, result2, 0, i + offsetOfResult);
result = result2;
}
for (int x = 0; x < lengthOfMap; ++x) {
result[i + offsetOfResult + x] = lowerCharacterArray[x];
}
offsetOfResult += (mapstringLength - sourceCount);
} else {
result[i + offsetOfResult] = (char)lowerChar;
}
}
return new String(result, 0, stringLength + offsetOfResult);
}Explanation to the above code: The above java code represents how internally javascript code must be working. MIN_HIGH_SURROGATE. In the UTF-16 encoding, the minimum value of a Unicode high-surrogate code unit constant is ‘\uD800’. MAX_HIGH_SURROGATE. In the UTF-16 encoding, the maximum value of a Unicode high-surrogate code unit constant is ‘\uDBFF’. MIN_SUPPLEMENTARY_CODE_POINT. In the UTF-16 encoding, the minimum value of a Unicode supplementary code point constant is U+10000.
Conclusion
We can conclude that for both the methods toLowerCase() and toUpperCase() and their variants for a locale, the internal working is very similar. In both the methods, the symbols and numbers are retained; only the characters are converted to lower case or upper case. We should keep in mind that both methods do not modify the characters of the original strings. Instead, both of them create a new String object which contains the same value as the characters in their desired format. Both these methods work well and are introduced in ECMAScript 1 javascript version.