Typescript string capitalize first letter [Using 4 methods]

In this typescript tutorial, we will see how to capitalize the first letter of a string in typescript.

There are four methods in typescript to capitalize the first letter of the string:

  1. Using charAt and toUpperCase
  2. Using the spread operator and toUpperCase
  3. Using a regular expression and replace
  4. Using slice, toUpperCase, and string concatenation

Using charAt and toUpperCase

Here we will see how we can capitalize the first letter of a string in typescript using the charAt and toUpperCase methods.

The charAt(0) method returns the first character of the string and toUpperCase() is used to capitalize it in typescript.

For example, we will take a string, and we will get the first character/letter using charAt(), then we will capitalize it using toUpperCase(). At last, we will merge the capitalized letter with rest of the string using slice() in typescript.

Open the code editor, then create a file named as ‘CapitalizeFirstLetter.ts’, and write the below code.

function capitalizeFirstLetter(str: string): string {
    return str.charAt(0).toUpperCase() + str.slice(1);
  }
  
  // Example:
  const myString = "canada";
  const capitalizedString = capitalizeFirstLetter(myString);
  console.log(capitalizedString); //👉 "Canada"

To compile the code run the below command, and you can see the result in the console.

ts-node CapitalizeFirstLetter
Typescript string capitalize first letter
capitalize the first letter of a string in typescript using the charAt and toUpperCase methods

This is an example of capitalizing the first letter of a string in typescript using the charAt and toUpperCase methods.

Using the spread operator and toUpperCase

Here we will see how we can capitalize the first letter of a string in typescript using the spread operator and toUpperCase methods.

For example, we will use the spread operator ([...str]) to convert the string to an array of letters, then get the first element of the array and capitalize it using toUpperCase. At last, we concatenate the capitalized letter with the rest of the string using slice() method.

In the CapitalizeFirstLetter.ts file write the below code:

function capitalizeFirstLetter(str: string): string {
    return [...str][0].toUpperCase() + str.slice(1);
  }
  
  // Example:
  const myString = "canada";
  const capitalizedString = capitalizeFirstLetter(myString);
  console.log(capitalizedString); //👉 "Canada"

To compile the code run the below command, and you can see the result in the console

ts-node CapitalizeFirstLetter
capitalize the first letter of a string in typescript using the spread operator and toUpperCase methods
capitalize the first letter of a string in typescript using the spread operator and toUpperCase methods

This is an example of capitalizing the first letter of a string in typescript using the spread operator and toUpperCase methods.

Using a regular expression and replace

Here we will see how we can capitalize the first letter of a string in typescript using the regular expression and replace methods.

For example, we will use a regular expression to match the first-word letter in the string, then pass it to the toUpperCase method to capitalize it.

In the CapitalizeFirstLetter.ts file write the below code

function capitalizeFirstLetter(str: string): string {
    return str.replace(/^\w/, (c) => c.toUpperCase());
  }

  // Example:
  const myString = "canada";
  const capitalizedString = capitalizeFirstLetter(myString);
  console.log(capitalizedString); //👉 "Canada"

To compile the code run the below command, and you can see the result in the console.

ts-node CapitalizeFirstLetter
capitalize the first letter of a string in typescript using the regular expression and replace methods
capitalize the first letter of a string in typescript using the regular expression and replace methods

This is an example of capitalizing the first letter of a string in typescript using the regular expression and replace methods.

Using slice, toUpperCase, and string concatenation

Here we will see how we can capitalize the first letter of a string in typescript using the slice toUpperCase and string concatenation method.

For example, we will use the slice method to get the first letter of the string, then toUpperCase() to capitalize it. At last, we concatenate the capitalized letter with the rest of the string using slice().

In the CapitalizeFirstLetter.ts file write the below code

function capitalizeFirstLetter(str: string): string {
    return str.slice(0, 1).toUpperCase() + str.slice(1);
  }

   // Example:
  const myString = "canada";
  const capitalizedString = capitalizeFirstLetter(myString);
  console.log(capitalizedString); //👉 "Canada"

To compile the code run the below command, and you can see the result in the console

ts-node CapitalizeFirstLetter
capitalize the first letter of a string in typescript using the slice toUpperCase and string concatenation method
capitalize the first letter of a string in typescript using the slice toUpperCase and string concatenation method

This is an example of capitalizing the first letter of a string in typescript using the slice toUpperCase and string concatenation method.

Conclusion

In this typescript tutorial, we saw how to capitalize the first letter of a string in typescript using different methods in typescript. So the different typescript methods we covered are listed below.

  1. Using charAt and toUpperCase
  2. Using the spread operator and toUpperCase
  3. Using a regular expression and replace
  4. Using slice, toUpperCase, and string concatenation

You may like the following typescript tutorials:

>