Capitalizzare la prima lettera di una stringa in JavaScript

  2. HowTo
  3. Howtos JavaScript
  4. Capitalizzare la prima lettera di una …
Kirill Ibrahim 12 ottobre 2023
JavaScript JavaScript String
  1. Usa i metodi toUpperCase() e slice() per rendere maiuscola la prima lettera in JavaScript
  2. Usa toUpperCase() con charAt() per rendere maiuscola la prima lettera in JavaScript
  3. Usa toUpperCase() e replace() per rendere maiuscola la prima lettera in JavaScript
Capitalizzare la prima lettera di una stringa in JavaScript

Esistono diversi modi per rendere maiuscola la prima lettera della stringa in JavaScript.

Per esempio:

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

Usa i metodi toUpperCase() e slice() per rendere maiuscola la prima lettera in JavaScript

Il metodo toUpperCase() trasforma tutte le lettere in una stringa in maiuscolo; lo useremo in combinazione con altre funzioni JavaScript per raggiungere il nostro obiettivo desiderato.

Il metodo slice(start,end) estrae una sezione di una stringa e la restituisce come una nuova stringa.

start è il parametro richiesto. È la posizione in cui iniziare la stringa di slice.

end è opzionale. È la posizione in cui terminare la stringa slice. Se omesso, slice() termina alla fine della stringa.

Esempio:

<!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>

Produzione:

JavaScript rende maiuscola la prima lettera di una stringa

Un altro esempio:

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

Usa toUpperCase() con charAt() per rendere maiuscola la prima lettera in JavaScript

Il metodo charAt() restituisce il carattere dall’indice specificato in una stringa. L’indice inizia da 0.

Esempio:

// 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);
  ;
}

Usa toUpperCase() e replace() per rendere maiuscola la prima lettera in JavaScript

Il replace() è un metodo integrato in JavaScript che cerca nella stringa data un valore specificato o un modello di espressione regolare, lo sostituisce e restituisce una nuova stringa.

JavaScript sostituire() Sintassi:

string.replace(paramA, paramB)

Qui, il paramA è un valore o un’espressione regolare, e paramB è un valore con cui sostituire paramA.

Nota: la stringa originale rimarrà invariata e il valore restituito è una nuova stringa con elementi sostituiti.

Esempio rapido sul metodo 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: il metodo replace() sostituisce solo la prima istanza per impostazione predefinita. Dovremmo usare il modificatore globale (g) dell’espressione regolare per sostituire tutte le occorrenze.

Esempio:

// 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());
}

/^./ rappresenta la prima lettera della stringa. Ulteriori informazioni sulle espressioni regolari nel Tutorial RegExp e nel Riferimento oggetto RegExp.

Articolo correlato - JavaScript String