Converting any case to camelCase in JavaScript

In this article, we create a function that can take a string in any format. Such as normal case, snake case, pascal case or any other into camelCase in JavaScript.

camelCase is a writing style where each word within a phrase is capitalized, except for the first word, and there are no spaces or punctuation.

Let us understand through some sample example of I/O Scenario ?

Sample Input -

const str = 'New STRING';

Sample Output -

const output = 'newString';

Converting any case to camelCase in JavaScript

Converting any case to camelCase in JavaScript is quite easy. Let's learn through the following programs ?

• Using Regular Expressions
• Splitting and Mapping
• Using String Manipulation and Iteration

Using Regular Expressions

In this program, the function toCamelCase(str) converts a given string to camelCase format by converting to lowercase and then replacing any non-alphanumeric characters followed by a character with just that character in uppercase.

Example

function toCamelCase(str) {
  return str
    .toLowerCase()
    .replace(/[^a-zA-Z0-9]+(.)/g, (match, group1) => group1.toUpperCase());
}

const snakeCase = "tutorials_point";
const kebabCase = "tutorials-point";
const mixedCase = "Tutorials-Point_Company";

console.log(toCamelCase(snakeCase)); 
console.log(toCamelCase(kebabCase));
console.log(toCamelCase(mixedCase)); 

tutorialsPoint
tutorialsPoint
tutorialsPointCompany

Using Splitting and Mapping

Here, the function 'toCamelCase(str)' converts a string to camelCase by splitting it based on non-alphanumeric characters, lowercasing the first word, and capitalizing the first letter of subsequent words. Then it joins these words back into a single string.

Note: In pascal case it converts all the string into lowercase because the entire string is treated as a single word.

Example

function toCamelCase(str) {
  const words = str.split(/[^a-zA-Z0-9]+/).map((word, index) => {
    if (index === 0) return word.toLowerCase();
    return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
  });
  return words.join('');
}

const normalCase = "Tutorials company";
const snakeCase = "tutorials_point_company";
const pascalCase = "TutorialsPointCompany";

console.log(toCamelCase(normalCase));
console.log(toCamelCase(snakeCase));  
console.log(toCamelCase(pascalCase)); 

tutorialsCompany
tutorialsPointCompany
tutorialspointcompany

Using String Manipulation and Iteration

In the following program, the function 'toCamelCase(str)' iterates through each character of the string, converting it to lowercase and setting a flag to capitalize the next character when encountering non-alphanumeric characters. This creates camelCase from strings with separators.

Example

function toCamelCase(str) {
  let result = '';
  let capitalizeNext = false;

  for (let i = 0; i < str.length; i++) {
    const char = str[i];
    if (/[^a-zA-Z0-9]/.test(char)) {
      capitalizeNext = true;
    } else {
      if (capitalizeNext) {
        result += char.toUpperCase();
        capitalizeNext = false;
      } else {
        result += char.toLowerCase();
      }
    }
  }

  return result;
}

const kebabCase = "tutorials-point-company";
const mixedCase = "Tutorials Point_Company";

console.log(toCamelCase(kebabCase)); 
console.log(toCamelCase(mixedCase));  

tutorialsPointCompany
tutorialsPointCompany

Comparison of Methods

Conclusion

All three methods effectively convert strings to camelCase. Regular expressions provide the most concise solution, while splitting and mapping offers better readability for complex transformations.