Un nuevo elemento agregado en ES6 es la plantilla literal. Es un nuevo tipo para crear cadenas en JavaScript que agrega varias características nuevas importantes, como la capacidad de crear cadenas de varias líneas e incluir una expresión en una cadena. Como desarrollador, todas estas características pueden mejorar sus habilidades para manipular cadenas y permitirle crear cadenas dinámicas.
Esta publicación ilustrará los literales de plantilla y cómo usarlos en JavaScript.
¿Qué son los literales de plantilla de JavaScript (cadenas de plantilla)?
“ Literales de plantilla ” se conocen comúnmente como “ Cadenas de plantilla ”. Están rodeados por el acento grave ( “ ) carácter, en comparación con las comillas en cadenas. Sus marcadores de posición se indican con el signo de dólar ' $ ”, y llaves {} me gusta ' ${expresión} ” es aceptable en los literales de plantilla. Si desea utilizar una expresión, puede ponerla en el ' ${expresión} ” cuadro dentro de los backticks.
Un literal de plantilla es una versión mejorada de una cadena JavaScript estándar. Las sustituciones hacen una distinción significativa entre un literal de plantilla y una cadena ordinaria. Puede integrar variables y expresiones en una cadena usando sustitutos. Estas variables y expresiones tendrán sus valores reemplazados automáticamente por el motor de JavaScript.
Sintaxis
Use la siguiente sintaxis para declarar una sola cadena usando literales de plantilla:
` cadena de texto `
Para varias líneas, siga la sintaxis dada:
` línea de texto de cadena 1
línea de texto de cadena
Si desea agregar una expresión dentro de los acentos graves, se utiliza la siguiente sintaxis:
Consulte los siguientes ejemplos para desarrollar una mejor comprensión del concepto establecido.
Ejemplo 1: declarar una cadena de una sola línea usando literales de plantilla de JavaScript
Por lo general, para crear una cadena, se requiere usar comillas simples o dobles, pero en los literales de plantilla, puede crear una cadena de la siguiente manera:
consola.log ( ` Sugerencia de Linux ` ) ;
El resultado muestra que funciona igual que la simple creación de sting con la ayuda de comillas simples o dobles:
Ejemplo 2: Declarar cadena multilínea utilizando literales de plantilla de JavaScript
Normalmente, para imprimir varias líneas, usamos el operador de concatenación (+) y para agregar una nueva línea, se puede utilizar (\n), que a menudo puede hacer que el código sea complejo:
consola.log ( 'Bienvenido a LinuxHint. \norte ' + 'El mejor sitio web para aprender habilidades'. ) ;
Mientras que para usar literales de plantilla, puede comenzar una nueva línea presionando enter desde el teclado en el bloque de acentos graves:
el mejor sitio web por habilidades de aprendizaje. ` ) ;
Producción
Ejemplo 3: cadena con sustituciones de expresión
Aquí, primero crearemos dos variables “ X ' y ' y ”, con los valores “ 20 ' y ' 15 ”, respectivamente:
var x = 20 ;var y = 15 ;
Luego, crea una variable “ suma ” para agregar el “ X ' y ' y ”:
Si desea agregar dos números y mostrar la suma de estos números en la consola, normalmente se requiere concatenar las cadenas y las variables en formato de cadena normal, lo que a menudo crea un lío para usar comillas simples o dobles repetidamente con las cadenas y unirlas. entre sí y con las variables usando ( + ):
Mientras que, usando los literales de la plantilla, solo tiene que especificar las cadenas con variables como una expresión dentro del ' ${} ” en bloque de acento grave:
Producción
Hemos recopilado toda la información esencial relacionada con los literales de la plantilla.
Conclusión
“ Literales de plantilla ', también conocido como ' Cadenas de plantilla ”, es una versión mejorada de una cadena JavaScript estándar rodeada por el acento grave ( “ ) carácter, en comparación con las comillas en cadenas. Permite la creación de cadenas de una o varias líneas sin utilizar el operador de concatenación e incluye una expresión en una cadena. Esta publicación ha discutido los literales de plantilla en JavaScript con ejemplos explicados.