Nozioni di base sull'interpolazione di stringhe
Includa espressioni nei template literal.
Nozioni di base sull'interpolazione di stringhe è una lezione JavaScript Academy gratuita su CoddyKit. Questa è la lezione 1 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento JavaScript Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso JavaScript Academy include 4 lezioni in totale.
Cosa sono i template literal
I template literal sono un modo per creare stringhe usando il carattere backtick invece delle virgolette. Consentono di inserire direttamente le espressioni in una stringa senza concatenarle manualmente.
Un segnaposto si scrive con un simbolo del dollaro seguito da parentesi graffe che racchiudono un'espressione. JavaScript valuta l'espressione e inserisce il suo valore nella stringa.
const name = "Alice"
const greeting = "Hello, " + name + "!"
console.log(greeting)Sintassi dell'interpolazione
All'interno di un template literal si inserisce un'espressione tra una parentesi graffa preceduta dal simbolo del dollaro e una parentesi graffa di chiusura. L'espressione viene valutata e convertita in una stringa.
L'esempio seguente usa la semplice concatenazione per produrre lo stesso risultato che si otterrebbe con l'interpolazione, così l'idea è chiara senza mostrare la sintassi del literal.
const product = "Book"
const price = 12
const line = product + " costs " + price + " dollars"
console.log(line)Perché l'interpolazione è utile
La concatenazione con l'operatore più diventa difficile da leggere quando si combinano molte variabili e testo letterale. L'interpolazione mantiene intatto il testo circostante e sostituisce solo le parti dinamiche.
- Meno operatori più
- Nessun errore accidentale negli spazi
- Intento più chiaro
const user = "Bob"
const count = 3
console.log(user + " has " + count + " messages")Inserire qualsiasi espressione
Un segnaposto può contenere qualsiasi espressione valida, non solo una variabile. Sono supportati anche calcoli aritmetici, chiamate di funzioni e accessi alle proprietà.
const a = 5
const b = 7
console.log("Sum is " + (a + b))
console.log("Max is " + Math.max(a, b))Chiamare funzioni al suo interno
È possibile chiamare una funzione e inserire il valore restituito nella stringa. L'esempio mostra la forma equivalente ottenuta con la concatenazione.
function upper(s) { return s.toUpperCase() }
const word = "hello"
console.log("Loud: " + upper(word))Accesso alle proprietà
Le proprietà degli oggetti possono essere lette direttamente all'interno di un segnaposto. Qui vengono letti alcuni campi da un oggetto utente.
const user = { name: "Eve", age: 30 }
console.log("Name: " + user.name + ", Age: " + user.age)I numeri diventano stringhe
Quando un numero viene inserito in un contesto stringa, viene convertito automaticamente nella sua forma testuale. La stessa conversione avviene con l'interpolazione.
const total = 19.99
console.log("Total: $" + total)Operatori ternari nei segnaposto
La logica condizionale con l'operatore ternario può essere inserita in un segnaposto, consentendo di scegliere tra due valori direttamente nell'espressione.
const score = 72
const grade = score >= 60 ? "Pass" : "Fail"
console.log("Result: " + grade)Espressioni annidate
I segnaposto possono contenere catene di metodi e chiamate annidate. Viene inserito qualunque sia il risultato della valutazione dell'espressione.
const items = ["a", "b", "c"]
console.log("Joined: " + items.join("-"))
console.log("Count: " + items.length)Combinare molti valori
I template literal sono particolarmente utili quando una frase combina diverse variabili. Confronti la versione interpolata, più leggibile e descritta a parole, con questo equivalente concatenato.
const city = "Paris"
const temp = 21
const sky = "sunny"
console.log("In " + city + " it is " + temp + "C and " + sky)Fare l'escape del simbolo del dollaro
Se desidera visualizzare una sequenza letterale dollaro-parentesi graffa come testo anziché come segnaposto, esegua l'escape del simbolo del dollaro con una barra rovesciata all'interno di un template literal. Nelle stringhe normali non è necessario alcun escape.
const text = "Use $\{x\} for a placeholder"
console.log(text)Verifica rapida
Verifichi la sua comprensione dell'interpolazione.
Riepilogo
Riepilogo: i template literal usano i backtick e i segnaposto per inserire espressioni nelle stringhe.
- Un segnaposto valuta qualsiasi espressione
- I valori vengono convertiti in stringhe
- L'interpolazione è più chiara di una lunga concatenazione
- Esegua l'escape del simbolo del dollaro per visualizzarlo letteralmente
const n = "World"
console.log("Hello, " + n + "!")Domande Frequenti
La lezione «Nozioni di base sull'interpolazione di stringhe» è gratuita?
Sì — il testo completo di «Nozioni di base sull'interpolazione di stringhe» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso JavaScript Academy, passa a CoddyKit PRO. Il corso JavaScript Academy include 4 lezioni in totale.
Cosa imparerò in «Nozioni di base sull'interpolazione di stringhe»?
Includa espressioni nei template literal. Eserciti JavaScript Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.
Ho bisogno di esperienza per iniziare JavaScript Academy?
Non è richiesta alcuna esperienza precedente. JavaScript Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 1 di 4.
Quanto tempo richiede la lezione «Nozioni di base sull'interpolazione di stringhe»?
La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.
Posso scrivere ed eseguire codice in questa lezione JavaScript Academy?
Sì. Ogni lezione JavaScript Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.
Tutte le lezioni di questo corso
- Nozioni di base sull'interpolazione di stringhe
- Stringhe multilinea
- Funzioni template con tag
- Casi d'uso pratici dei template con tag