Captilizar a primeira letra de uma string em JavaScript

  1. Use os métodos toUpperCase() e slice() para captilizar a primeira letra em JavaScript
  2. Utilize toUpperCase() Com charAt() para Captilizar a Primeira Carta em JavaScript
  3. Utilize toUpperCase() e replace() para Captilizar a Primeira Letra em JavaScript

Há uma série de maneiras de capitalizar a primeira letra da string em JavaScript.

Por exemplo:

  • "this is an example" -> "This is an example"
  • "the Atlantic Ocean" -> "The Atlantic Ocean"

Use os métodos toUpperCase() e slice() para captilizar a primeira letra em JavaScript

O método toUpperCase() transforma todas as letras numa string em maiúsculas; utilizá-lo-emos em combinação com outras funções JavaScript para atingir o nosso objectivo desejado.

O método slice(start,end) extrai uma secção de uma string e devolve-a como uma nova string.

O start é o parâmetro requerido. É a posição onde se começa a cortar a string.

end é opcional. É a posição onde se deve terminar a string de corte. Se omitido, slice() termina no fim da string.

Exemplo:

<!DOCTYPE html>   
<html>   
    <head>  
        <title></title> 
    </head>  
        
    <body style = "text-align:center;">     
          
        <input id = "input" type="text" name="input"/>  
        <button onclick="capitalizeString()">  
            Capitalize 
        </button>  
        <h3 id = "modified-string" > 
        </h3> 
            
        <script>  
         
        function capitalizeString() { 
          let input = document.getElementById("input"); 
          let headingElement = document.getElementById("modified-string"); 
          let string = input.value; 
          headingElement.innerHTML = string[0].toUpperCase() +  
            string.slice(1); 
        } 
        </script>  
    </body>   
</html>

Resultado:

JavaScript captiliza a primeira letra de uma string

Outro exemplo:

//shortened version
function capitalize(sentence)
{
    return sentence && sentence[0].toUpperCase() + sentence.slice(1);
}

Utilize toUpperCase() Com charAt() para Captilizar a Primeira Carta em JavaScript

O método charAt() devolve o carácter do índice especificado numa string. O índice começa em 0.

Exemplo:

//We will use the same html above 
function capitalizeString() { 
     let input = document.getElementById("input"); 
     let headingElement = document.getElementById("modified-string"); 
     let string = input.value; 
     headingElement.innerHTML = string.charAt(0).toUpperCase() + 
         string.slice(1); ; 
 }

Utilize toUpperCase() e replace() para Captilizar a Primeira Letra em JavaScript

O replace() é um método inbuilt em JavaScript que procura na string dada um valor especificado ou um padrão de expressão regular, substitui-a, e devolve uma nova string.

JavaScript replace() Syntax:

string.replace(paramA, paramB)

Aqui, o paramA é um valor ou expressão regular, e o paramB é um valor para substituir o paramA por.

Nota: A string original permanecerá inalterada, e o valor devolvido é uma nova string com itens substituídos.

Exemplo rápido no método replace():

function replaceFunction() {
  let str = "Google Event"; 
  let res = str.replace("Google", "Microsoft");
  console.log(res)
}
replaceFunction(); 

function replaceAllFunction() {
  let str = "Google Event will be in Headquarters of Google"; 
  let res = str.replace(/Google/g, "Microsoft");
  console.log(res)
}
replaceFunction(); 

Nota: o método replace() apenas substitui a primeira instância por padrão. Devemos usar o modificador global de expressão regular (g) para substituir todas as ocorrências.

Exemplo:

//We will use the same html above 
function capitalizeString() { 
    let input = document.getElementById("input"); 
    let headingElement = document.getElementById("modified-string"); 
    let string = input.value; 
    headingElement.innerHTML = string.replace(/^./, string[0].toUpperCase());
} 

/^./ representa a primeira letra da string. Leia mais sobre expressões regulares no RegExp Tutorial e no RegExp Object Reference.

Artigo relacionado - JavaScript String

  • Verificar se há uma string vazia em JavaScript
  • JavaScript Retirar o primeiro caractere da string