Modelli letterali in javascript | Spiegato

JavaScript è un linguaggio di programmazione Web di alto livello che ci fornisce il tipo di dati di stringa in cui possiamo archiviare stringhe. Le stringhe possono essere implementate con citazioni singole o doppie citazioni ("o" ") in JavaScript. var mystring = "Hello World!";

Tuttavia, il tipo di dati di stringa è limitato e non offre molte funzionalità come un linguaggio di programmazione di alto livello (Python, Ruby) fornisce ai suoi sviluppatori. Questo problema è stato risolto quando ha introdotto JavaScript Letterali modello in ES6. Vediamo quali sono i letterali del modello in JavaScript in questo post.

Letterali modello

I letterali modello ci danno la possibilità di lavorare con stringhe con più controllo e più potenza sul tipo di dati di stringa tradizionale. A differenza delle stringhe, l'uso dei letterali dei modelli Backticks " Piuttosto che marchi di virgole singoli o doppi come mostrato di seguito:

var mystring = 'ciao mondo!';

Alcune delle stringhe modello di funzionalità ci forniscono:

• Interpolazione: assegnare variabili ed espressioni all'interno di un modello letterale.
• Stringhe multiline: non abbiamo bisogno /N Per andare a un'altra linea, andiamo semplicemente a un'altra linea in modello letterale e il browser sa che deve mostrare quella stringa su un'altra riga.
• Modelli contrassegnati: cambia letteralmente il modello, quindi dopo aver cambiato il modello letterale restituisce la stringa risultante. I modelli taggati sono proprio come le funzioni con l'eccezione che vengono chiamate senza () parentesi.

Esploriamo queste funzionalità una per una:

Interpolazione

Le variabili ed espressioni possono essere facilmente interpolate in stringhe usando letterali modello. Incorporare un'espressione all'interno del modello letterale è noto come Interpolazione. Possiamo ottenere l'interpolazione usando il $ somevar sintassi. Vediamo un esempio:

var mystring = 'ciao mondo!';
console.log ('ha detto: $ mystring');

Nel codice sopra, stiamo inizializzando una variabile e accedendola all'interno di una stringa usando la sintassi di interpolazione. E per visualizzare il risultato sulla console, stiamo usando la console.Metodo log ():

Stringhe multiline

Un'altra applicazione del modello letterale è che ci dà la possibilità di gestire o scrivere le stringhe in più righe. Prima dei letterali modello, è stato un po 'difficile e complicato in quanto abbiamo dovuto usare la retromarcia all'interno delle doppie citazioni per dire al browser che la stringa dovrebbe essere sulla riga successiva. Per esempio:

var mystring = "hello \ n"+"mondo!";
console.log (mystring);

Nel codice sopra, abbiamo inizializzato una stringa e utilizzato \N per dire al browser che la stringa dopo \N dovrebbe essere sulla riga successiva.

Ora vediamo come possiamo ottenere la stessa funzionalità usando il modello letterale in cui scriveremo semplicemente la seconda stringa su un'altra riga:

var mystring = 'ciao
Mondo!';
console.log (mystring);

Possiamo vedere che i letterali dei modelli hanno reso molto facile per noi scrivere stringhe multiline ed è più facilmente leggibile e comprensibile.

Modelli contrassegnati

Un'altra potente caratteristica di caratteristiche letterali ci dà sono i modelli taggati che modificano semplicemente una stringa modello aggiungendo un nome di funzione all'inizio della stringa del modello. In parole più semplici, un modello taggato cambia letteralmente il modello e restituisce la stringa risultante.

I modelli contrassegnati sono definiti esattamente come una funzione, tuttavia quando si chiama un tag modello non si utilizza il () parentesi. La sintassi per l'inizializzazione di una funzione tag è riportata di seguito:

function tagname (letterali, ... sostituzioni)
// restituisce qualche stringa

La funzione del tag richiede due argomenti; Il primo è il letterali che indicano le corde letterali e il secondo è il ... sostituzioni in cui sono memorizzati gli input successivi analizzati per ciascuna sostituzione.

Ora guardiamo un esempio per implementare una funzione tag:

// modello tag
funzione mytagname (mystring)
restituire mystring;

// Creazione del modello taggato
const output = mytagname'hello name ';
// Visualizza il risultato
console.registro (output);

Nel codice sopra, abbiamo creato una funzione che sta restituendo una stringa. Successivamente, abbiamo creato un modello taggato e quindi chiamato la funzione modello tag sopra per la quale è utilizzata la sintassi: nome mytagname'hello ' dove il mytagname è il tag modello e il Ciao nome è il modello letterale. Alla fine, abbiamo visualizzato il risultato usando la console.Metodo log ():

Guardiamo ora un altro esempio in cui passeremo letterali e sostituzioni alla funzione del tag:

// valori
Lasciate salutare = "Ciao!";
let name = "jhon";
// Funzione tag
Funzione Transform (letterali, ... Sostituzioni)
console.registro (letterali); // ["", " mi chiamo "]
console.registro (sostituzioni); // ["Hello", "Jhon"]

// Chiama la funzione letterale del tag
trasforma '$ galline il mio nome è $ name';

Nel codice sopra, definiamo innanzitutto la funzione del tag di trasformazione che assume due argomenti; "Letterali" che è un array e ha un contenuto statico ("Il mio nome è") mentre il parametro di riposo delle sostituzioni è anche un array con tutti i tag (saluto, nome). L'output del codice sopra è mostrato di seguito:

Conclusione

La stringa di tipo dati standard fornita da JavaScript non era abbastanza potente, quindi JavaScript ha introdotto i letterali modello in ES6. I letterali del modello ci danno più potenza sopra le stringhe e vengono inizializzati usando backticks ". In questo post, abbiamo visto quali letterali modello sono in JavaScript insieme alle caratteristiche che i letterali del modello ci offrono sulla stringa JavaScript standard.