Convert Strings to Camelcase | JavaScript Tutorials

Introduction

In this lab, we will learn how to convert strings to camelcase using JavaScript. Camelcase is a naming convention used in programming where multi-word identifiers are written in a way that each word, except the first one, starts with a capital letter without any spaces or underscores between them. The toCamelCase() function provided in this lab uses regular expressions and array methods to convert strings to camelcase.

This is a Guided Lab, which provides step-by-step instructions to help you learn and practice. Follow the instructions carefully to complete each step and gain hands-on experience. Historical data shows that this is a beginner level lab with a 100% completion rate. It has received a 100% positive review rate from learners.

Camelcase String Conversion

To convert a string to camelcase, follow these steps:

Open the Terminal/SSH and type node to start practicing coding.
Use String.prototype.match() with an appropriate regular expression to break the string into words.
Use Array.prototype.map(), Array.prototype.slice(), Array.prototype.join(), String.prototype.toLowerCase(), and String.prototype.toUpperCase() to combine the words and capitalize the first letter of each one.
Use the toCamelCase function shown below to perform the conversion:

const toCamelCase = (str) => {
  const words =
    str &&
    str.match(
      /[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g
    );
  const capitalizedWords =
    words &&
    words.map(
      (word) => word.slice(0, 1).toUpperCase() + word.slice(1).toLowerCase()
    );
  const camelCaseString = capitalizedWords && capitalizedWords.join("");
  return (
    camelCaseString &&
    camelCaseString.slice(0, 1).toLowerCase() + camelCaseString.slice(1)
  );
};

Here are some examples of how to use the toCamelCase function:

toCamelCase("some_database_field_name"); // 'someDatabaseFieldName'
toCamelCase("Some label that needs to be camelized");
// 'someLabelThatNeedsToBeCamelized'
toCamelCase("some-javascript-property"); // 'someJavascriptProperty'
toCamelCase("some-mixed_string with spaces_underscores-and-hyphens");
// 'someMixedStringWithSpacesUnderscoresAndHyphens'

Summary

Congratulations! You have completed the Camelcase String lab. You can practice more labs in LabEx to improve your skills.

Convert Strings to Camelcase with JavaScript

Introduction

Camelcase String Conversion

Summary