Convert JavaScript String to be all lowercase

Question

How can I convert a JavaScript string value to be in all lowercase letters?

Example: "Your Name" to "your name"

Answer 1

const lowerCaseName = "Your Name".toLowerCase(); // your name

Answer 2

Simply you can use built-in methods of javascript like toLowerCase()

let str=Hello World;
let lowercasestr=str.toLowerCase()
console.log("lowercasestr")

Answer 3

Option 1: Using toLowerCase()

var x = 'ABC';
x = x.toLowerCase();

Option 2: Using your own function

function convertToLowerCase(str) {
  var result = '';

  for (var i = 0; i < str.length; i++) {
    var code = str.charCodeAt(i);
    if (code > 64 && code < 91) {
      result += String.fromCharCode(code + 32);
    } else {
      result += str.charAt(i);
    }
  }
  return result;
}

Call it as:

x = convertToLowerCase(x);

Answer 4

Methods or functions: toLowerCase() and toUpperCase()

Description: These methods are used to cover a string or alphabet from lowercase to uppercase or vice versa. E.g., "and" to "AND".

Converting to uppercase:

Example code:

<script language=javascript>
    var ss = " testing case conversion method ";
    var result = ss.toUpperCase();
    document.write(result);
</script>

Result: TESTING CASE CONVERSION METHOD

Converting to lowercase:

Example Code:

<script language=javascript>
    var ss = " TESTING LOWERCASE CONVERT FUNCTION ";
    var result = ss.toLowerCase();
    document.write(result);
</script>

Result: testing lowercase convert function

Explanation: In the above examples,

• toUpperCase() method converts any string to "UPPER" case letters.

• toLowerCase() method converts any string to "lower" case letters.

Answer 5

Yes, any string in JavaScript has a toLowerCase() method that will return a new string that is the old string in all lowercase. The old string will remain unchanged.

So, you can do something like:

"Foo".toLowerCase();
document.getElementById('myField').value.toLowerCase();

Answer 6

Try

<input type="text" style="text-transform: uppercase">  <!-- uppercase -->
<input type="text" style="text-transform: lowercase">  <!-- lowercase -->

Demo - JSFiddle

Answer 7

toLocaleUpperCase() or lower case functions don't behave like they should do. For example, on my system, with Safari 4, Chrome 4 Beta, and Firefox 3.5.x, it converts strings with Turkish characters incorrectly. The browsers respond to navigator.language as "en-US", "tr", "en-US" respectively.

But there isn't any way to get user's Accept-Lang setting in the browser as far as I could find.

Only Chrome gives me trouble although I have configured every browser as tr-TR locale preferred. I think these settings only affect the HTTP header, but we can't access to these settings via JavaScript.

In the Mozilla documentation it says "The characters within a string are converted to ... while respecting the current locale. For most languages, this will return the same as ...". I think it's valid for Turkish, and it doesn't differ if it's configured as en or tr.

In Turkish it should convert "DİNÇ" to "dinç" and "DINÇ" to "dınç" or vice-versa.

Answer 8

Just an example for toLowerCase(), toUpperCase() and a prototype for the not yet available toTitleCase() or toProperCase():

String.prototype.toTitleCase = function() {
  return this.split(' ').map(i => i[0].toUpperCase() + i.substring(1).toLowerCase()).join(' ');
}

String.prototype.toPropperCase = function() {
  return this.toTitleCase();
}

var OriginalCase = 'Your Name';
var lowercase = OriginalCase.toLowerCase();
var upperCase = lowercase.toUpperCase();
var titleCase = upperCase.toTitleCase();

console.log('Original: ' + OriginalCase);
console.log('toLowerCase(): ' + lowercase);
console.log('toUpperCase(): ' + upperCase);
console.log('toTitleCase(): ' + titleCase);

Answer 9

I paid attention that lots of people are looking for strtolower() in JavaScript. They are expecting the same function name as in other languages, and that's why this post is here.

I would recommend using a native JavaScript function:

"SomE StriNg".toLowerCase()

Here's the function that behaves exactly the same as PHP's one (for those who are porting PHP code into JavaScript)

function strToLower (str) {
    return String(str).toLowerCase();
}

Answer 10

Note that the function will only work on string objects.

For instance, I was consuming a plugin, and was confused why I was getting a "extension.tolowercase is not a function" JavaScript error.

 onChange: function(file, extension)
    {
      alert("extension.toLowerCase()=>" + extension.toLowerCase() + "<=");

Which produced the error "extension.toLowerCase is not a function". So I tried this piece of code, which revealed the problem!

alert("(typeof extension)=>" + (typeof extension) + "<=");;

The output was "(typeof extension)=>object<=" - so aha, I was not getting a string var for my input. The fix is straightforward though - just force the darn thing into a String!:

var extension = String(extension);

After the cast, the extension.toLowerCase() function worked fine.

Answer 11

You can use the in built .toLowerCase() method on JavaScript strings. Example:

var x = "Hello";
x.toLowerCase();

Answer 12

Try this short way:

var lower = (str+"").toLowerCase();

Answer 13

In case you want to build it yourself:

function toLowerCase(string) {

    let lowerCaseString = "";

    for (let i = 0; i < string.length; i++) {
        // Find ASCII charcode
        let charcode = string.charCodeAt(i);

        // If uppercase
        if (charcode > 64 && charcode < 97) {
            // Convert to lowercase
            charcode = charcode + 32
        }

        // Back to char
        let lowercase = String.fromCharCode(charcode);

        // Append
        lowerCaseString = lowerCaseString.concat(lowercase);
    }

    return lowerCaseString
}

Answer 14

const str = 'Your Name';

// convert string to lowercase
const lowerStr = str.toLowerCase();

// print the new string
console.log(lowerStr);

Answer 15

Simply use JS toLowerCase()
let v = "Your Name" let u = v.toLowerCase(); or
let u = "Your Name".toLowerCase();

Answer 16

Use either toLowerCase or toLocaleLowerCase methods of the String object. The difference is that toLocaleLowerCase will take current locale of the user/host into account. As per § 15.5.4.17 of the ECMAScript Language Specification (ECMA-262), toLocaleLowerCase…

…works exactly the same as toLowerCase except that its result is intended to yield the correct result for the host environment’s current locale, rather than a locale-independent result. There will only be a difference in the few cases (such as Turkish) where the rules for that language conflict with the regular Unicode case mappings.

Example:

var lower = 'Your Name'.toLowerCase();

Also note that the toLowerCase and toLocaleLowerCase functions are implemented to work generically on any value type. Therefore you can invoke these functions even on non-String objects. Doing so will imply automatic conversion to a string value prior to changing the case of each character in the resulting string value. For example, you can apply toLowerCase directly on a date like this:

var lower = String.prototype.toLowerCase.apply(new Date());

and which is effectively equivalent to:

var lower = new Date().toString().toLowerCase();

The second form is generally preferred for its simplicity and readability. On earlier versions of IE, the first had the benefit that it could work with a null value. The result of applying toLowerCase or toLocaleLowerCase on null would yield null (and not an error condition).