Il metodo charAt in JavaScript utilizzato sulle stringhe restituisce un carattere di una stringa. La posizione del carattere è indicata nell’indice tra parantesi tonde.
Quindi ad esempio charAt(0) restituisce il primo carattere, mentre charAt(1) restituisce il secondo e così via.
La sintassi è dunque la seguente: stringa.charAt(indice)
Dunque il metodo accetta un parametro obbligatorio, indice, che rappresenta la posizione del carattere da ricercare in una stringa.
Esempi di utilizzo del metodo charAt in JavaScript
In questo primo esempio cercheremo il primo carattere di una stringa in una semplice frase.
Ultimo carattere di una stringa con l’utilizzo del metodo charAt in JavaScript
Se vogliamo determinare l’ultimo carattere di una stringa, allora possiamo utilizzare la proprietà length sulla stringa. Infatti ricordiamo che str.length restituisce la quantità di caratteri di una stringa, quindi per ottenere l’ultimo carattere, dato che l’indice parte da 0, dobbiamo sottrarre 1.
Trasformare il primo carattere in maiuscolo con il metodo charAt ed uppercase in JavaScript
In questo esercizio estraiamo il primo carattere, lo convertiamo in maiuscolo con il metodo toUpperCase e dopo concateniamo tutto il resto utilizzando il metodo substr.
In questa breve lezione abbiamo implementato dei semplicissimi esercizi utilizzando il metodo charAt di JavaScript, proseguendo nel tutorial troverete tanti altri esempi di applicazione.
Il metodo split in JavaScript consente di dividere una stringa in base ad un separatore, salvare le sotto stringhe ottenute in un array e restituire quindi l’array così formato.
La sintassi di questo metodo è la seguente: stringa.split(separatore, limite).
Dove stringa rappresenta dunque la stringa da suddividere. Il parametro separatore è obbligatorio ed indica quale elemento utilizzare per effettuare la divisione (ad esempio uno spazio vuoto, una virgola, un trattino). Il parametro limite è invece opzionale e rappresenta il numero di suddivisione da fare. Quindi gli elementi che vanno oltre questo limite non verranno inclusi nella suddivisione.
Questo metodo è supportato su tutti i browser.
Esempi d’utilizzo del metodo split di JavaScript
Facciamo adesso dei semplici esempi d’utilizzo.
Esempio 1
Dunque prendiamo in input una semplice frase e dopo con il metodo split la suddividiamo utilizzando come elemento separatore lo spazio.
Ecco quindi il codice completo che utilizza il metodo split di JavaScript:
let coding = 'Programmare aiuta lo sviluppo del pensiero logico';
let codingSplit = coding.split(' ');
console.log(codingSplit);
Nella console del browser visualizzeremo un array di 7 elementi, come mostrato sotto:
Cambiamo la frase, aggiungendo un secondo pensiero dopo la virgola, come da esempio sotto:
let coding = 'Programmare aiuta lo sviluppo del pensiero logico, divertiamoci ad imparare JavaScript';
let codingSplit = coding.split(',');
console.log(codingSplit);
Come risultato vedremo nella console del browser un array di 2 elementi:
Array [ “Programmare aiuta lo sviluppo del pensiero logico”, ” divertiamoci ad imparare JavaScript” ]
In questo caso nella console del browser visualizzeremo il valore numerico 20, che corrisponde al numero di caratteri della frase.
Proprietà length di JavaScript sulle stringhe – secondo esempio
Determinare la lunghezza di una stringa, se è vuota riempirla con il valore coding creativo, altrimenti stampare a video il risultato.
Supponiamo di partire da una stringa vuota:
const frase = '';
Dopo, utilizzando la proprietà length di JavaScript sulle stringhe, calcoliamo la lunghezza della stringa e memorizziamo questo dato in una variabile:
const lunghezzaStringa = frase.length;
Dato che la stringa è vuota nella variabile lunghezzaStringa sarà memorizzato il valore 0.
Quindi, utilizzando le istruzioni condizionali, verifichiamo se la stringa non è vuota e dunque se la lunghezza è diversa da 0 oppure no. Se è vero visualizziamo la lunghezza della stringa, altrimenti poniamo la stringa di partenza uguale alla frase di esempio: ‘coding creativo’.
Ecco dunque di seguito una possibile implementazione in JavaScript per calcolare la lunghezza di una stringa:
In questa lezione abbiamo studiato la proprietà length di JavaScript utilizzata sulle stringhe, allo stesso modo la seguente proprietà si può utilizzare anche sugli array. Si può trovare il semplice tutorial di esempio al seguente link: proprietà length sugli array.
Il metodo lastIndexOfin JavaScript può essere utilizzato, così come indexOf, sia con gli array, sia con le stringhe. In questa lezione lo studieremo applicandolo alle stringhe.
La sintassi è quindi la seguente: stringa.lastIndexOf(value, inizio).
Il valore di ritorno è un valore numerico che rappresenta la posizione dell’ultima posizione dell’elemento nella stringa, se ce n’è più di uno. Se non trova questo valore restituisce -1.
Così come con indexOf, il valore, cioè il primo argomento passato come parametro, può essere una parola, un numero o una frase. Se si trova più di un’occorrenza di questo valore, il metodo restituisce sempre l’indice dell’ultimo valore trovato.
Invece il secondo parametro, inizio, è il punto da dove partire per effettuare la ricerca del valore. In qualche caso può essere necessario non partire dall’inizio della stringa. Se inizio non è specificato si parte dalla posizione 0.
Esempi d’uso del metodo lastIndexOf con le stringhe in JavaScript
Utilizziamo questo metodo in un primo esempio, dove prendiamo una stringa e in essa cerchiamo l’ultima occorrenza di una parola.
Ecco di seguito un semplice esempio:
const coding = 'Fare coding è divertente e creativo. Prova anche tu a fare coding.';
const indiceStringa = coding.lastIndexOf('coding');
console.log(indiceStringa);
Nella console del browser vedremo come risultato 60, cioè la posizione dell’ultima parola. Se avessimo usato indeOf avremmo ottenuto 5, ovvero la posizione della prima parola.
Se l’elemento da ricercare non è presente allora il metodo lastIndexOf in JavaScript restituisce il valore -1, quindi modifichiamo il valore da ricercare nella stringa, come nell’esempio sotto:
const coding = 'Fare coding è divertente e creativo. Prova anche tu a fare coding.';
const indiceStringa = coding.lastIndexOf('il coding');
console.log(indiceStringa);
Nella console del browser visualizzeremo dunque il valore -1.
In questa lezione abbiamo studiato l’utilizzo del metodo lastIndexOf in JavaScript con le stringhe, ricordiamo che lo stesso metodo si può applicare anche agli array.
Il metodo trim in JavaScript è utilizzato per rimuovere gli spazi bianchi (spazi, tabulazioni e ritorni a capo) dall’inizio e dalla fine di una stringa. Questo è particolarmente utile quando si gestiscono input utente o quando si manipolano stringhe che potrebbero contenere spazi aggiuntivi indesiderati.
La sintassi di questo metodo è piuttosto semplice, infatti si richiama il metodo semplicemente sulla stringa che si vuole ripulire: stringa.trim().
Dove stringa rappresenta dunque la stringa da manipolare.
Il metodo trim() in JavaScript non accetta parametri. Esso opera direttamente sulla stringa a cui è applicato, rimuovendo gli spazi bianchi (spazi, tabulazioni e ritorni a capo) solo dall’inizio e dalla fine della stringa.
Esempio d’uso di trim in JavaScript
Facciamo quindi un semplice esempio di utilizzo di questo metodo.
Prendiamo in input una stringa di esempio ‘Coding Creativo‘ con degli spazi vuoti inseriti all’inizio e alla fine e per comodità la visualizziamo nella console del browser.
Con ECMAScript 2019 (ES10) sono stati inseriti anche i metodi trimStart() e trimEnd(), questi metodi rimuovono gli spazi bianchi solo dall’inizio (parte sinistra) o dalla fine (parte destra) di una stringa. Possono essere dunque utilizzati quando si richiede l’eliminazione di spazi vuoti solo da un’estremo.
Conclusione
In questa lezione abbiamo visto semplicemente a cosa è utile il metodo trim di JavaScript, utilizzato sulle stringhe di testo. Nelle prossime lezioni vedremo altri modi per togliere spazi vuoti dall’inizio e dalla fine di una stringa.
Il metodo indexOf in JavaScript può essere utilizzato sia con gli array, sia con le stringhe. indexOf in questa lezione è applicato alle stringhe.
La sintassi di questo metodo JavaScript è dunque la seguente: stringa.indexOf(value, inizio).
Restituisce un valore numerico che rappresenta la posizione dell’elemento nella stringa. Se non trova il valore restituisce -1.
In particolare la stringa rappresenta dove ricercare il valore. Dove il valore, cioè il primo argomento passato come parametro, può essere una parola, un numero oppure una frase. Se viene trovata più di un’occorrenza di questo valore, il metodo restituisce comunque l’indice del primo valore trovato.
Il secondo parametro, inizio, rappresenta il punto da dove partire per effettuare la ricerca, in quanto in qualche caso può essere necessario non partire dall’inizio. Se non è specificato si parte da 0.
Esempi d’uso di indexOf con le stringhe in JavaScript
Facciamo un semplice esempio d’utilizzo di questo metodo.
Creiamo una frase e attraverso il metodo indexOf ricerchiamo ad esempio la parola pensiero.
const coding = 'Programmare aiuta lo sviluppo del pensiero logico, divertiamoci ad imparare JavaScript';
const indiceStringa = coding.indexOf('pensiero');
console.log(indiceStringa);
Come risultato nella console troveremo il valore 34 che indica la posizione della parola pensiero.
Se ad esempio la frase dovesse contenere più volte la parola pensiero, darebbe comunque sempre la posizione 34.
Abbiamo detto che se non trova l’elemento il metodo indexOf in JavaScript restituisce il valore -1, quindi facciamo la prova a modificare il valore da ricercare nella stringa, come nell’esempio sotto:
const coding = 'Programmare aiuta lo sviluppo del pensiero logico, divertiamoci ad imparare JavaScript';
const indiceStringa = coding.indexOf('il pensiero');
console.log(indiceStringa);
Dunque in questo caso nella console vedremo come risultato -1 in quanto il valore passato come argomento non è contenuto nella stringa.
Conclusione
In questa lezione abbiamo studiato l’utilizzo del metodo indexOf in JavaScript con le stringhe, lo stesso metodo si può applicare agli array, come vedremo in questa lezione: indexOf con gli array.
Commenti recenti