Un nou element adăugat în ES6 este literalul șablonului. Este un tip nou de creare de șiruri în JavaScript care adaugă câteva caracteristici noi importante, cum ar fi capacitatea de a crea șiruri de caractere cu mai multe linii și de a include o expresie într-un șir. În calitate de dezvoltator, toate aceste caracteristici vă pot îmbunătăți abilitățile de a manipula șiruri și vă pot permite să creați șiruri dinamice.
Această postare va ilustra literalele șablonului și cum să le folosiți în JavaScript.
Ce sunt literalele șabloane JavaScript (șiruri de șabloane)?
„ Literale șablon ' sunt cunoscute în mod obișnuit ca ' Șiruri de șabloane ”. Sunt înconjurate de căpuşă ( „ ), în comparație cu ghilimele din șiruri. Substituenții săi sunt indicați prin semnul dolarului „ $ ”, și bretele {} ca „ ${expression} ” este acceptabil în literalele șablon. Dacă doriți să utilizați o expresie, o puteți pune în „ ${expression} ” cutie din interiorul backticks.
Un literal șablon este o versiune îmbunătățită a unui șir JavaScript standard. Substituțiile fac o distincție semnificativă între un literal șablon și un șir obișnuit. Puteți integra variabile și expresii într-un șir folosind înlocuitori. Valorile acestor variabile și expresii vor fi înlocuite automat de motorul JavaScript.
Sintaxă
Utilizați sintaxa de mai jos pentru a declara un singur șir folosind literale șablon:
` text șir `
Pentru mai multe linii, urmați sintaxa dată:
` linie text șir 1
linie text șir
Dacă doriți să adăugați o expresie în interiorul backtick-urilor, se folosește următoarea sintaxă:
Consultați următoarele exemple pentru a dezvolta o mai bună înțelegere a conceptului declarat.
Exemplul 1: Declarați un șir cu o singură linie folosind Literale șablon JavaScript
De obicei, pentru a crea un șir, este necesar să folosiți ghilimele simple sau duble, dar în literalele șablon, puteți crea un șir după cum urmează:
console.log ( ` LinuxHint ` ) ;
Ieșirea arată că funcționează la fel ca și simpla creație cu ajutorul ghilimelelor simple sau duble:
Exemplul 2: Declarați șiruri cu mai multe linii utilizând literalele șablon JavaScript
În mod normal, pentru tipărirea mai multor linii, folosim operatorul de concatenare (+) și pentru a adăuga o nouă linie, se poate folosi (\n), care poate face adesea codul complex:
console.log ( „Bine ați venit la LinuxHint. \n ' + „Cel mai bun site web pentru învățarea abilităților.” ) ;
În timp ce utilizați literalmente șablon, puteți începe o nouă linie apăsând enter de la tastatură în blocul de backticks:
Cel mai bun site pentru abilități de învățare. ` ) ;
Ieșire
Exemplul 3: șir cu substituții de expresie
Aici, mai întâi vom crea două variabile „ X ' și ' Y ”, cu valorile “ douăzeci ' și ' cincisprezece ”, respectiv:
var x = douăzeci ;var y = cincisprezece ;
Apoi, creați o variabilă „ sumă ” pentru adăugarea „ X ' și ' Y ”:
Dacă doriți să adăugați două numere și să afișați suma acestor numere pe consolă, în mod normal, este necesar să concatenați șirurile și variabilele în format obișnuit de șir, ceea ce adesea creează o mizerie de a folosi ghilimele simple sau duble în mod repetat cu șirurile și de a le uni. între ele și cu variabilele folosind ( + ):
În timp ce, folosind literalele șablonului, trebuie doar să specificați șirurile cu variabile ca expresie în interiorul „ {} $ ” în blocul backtick:
Ieșire
Am adunat toate informațiile esențiale legate de literalele șablonului.
Concluzie
„ Literale șablon ', de asemenea cunoscut ca si ' Șiruri de șabloane ”, este o versiune îmbunătățită a unui șir JavaScript standard înconjurat de backtick ( „ ), în comparație cu ghilimele din șiruri. Permite crearea de șiruri cu o singură linie și mai multe linii fără utilizarea operatorului de concatenare și include o expresie într-un șir. Această postare a discutat despre literalele șablonului în JavaScript cu exemple explicate.