Los template literals

Los template literals (o literales de plantilla) son una forma más flexible y potente de trabajar con cadenas de texto en JavaScript. Se introdujeron en ES6 (ECMAScript 2015) y permiten crear cadenas de texto más complejas y dinámicas que las comillas simples (') o dobles (").

1. Características de los Template Literals #

1. Comillas Invertidas:

   • Los template literals se crean usando comillas invertidas (`) en lugar de comillas simples o dobles.
   • Ejemplo:

     1let saludo = `Hola, mundo!`;

2. Interpolación de Expresiones:

   • Una de las características más poderosas de los template literals es la interpolación de expresiones, que permite insertar variables y expresiones directamente dentro de una cadena usando la sintaxis ${}.

   • Ejemplo:

      
     1let nombre = "Juan";
     2let mensaje = `Hola, ${nombre}!`;
     3console.log(mensaje); // Muestra "Hola, Juan!"
     Salida de consola
     Hola, Juan!

   • Puedes insertar cualquier expresión dentro de ${}:

      
     1let a = 5;
     2let b = 10;
     3let suma = `La suma de ${a} y ${b} es ${a + b}.`;
     4console.log(suma); // Muestra "La suma de 5 y 10 es 15."
     Salida de consola
     La suma de 5 y 10 es 15.

3. Multilínea:

   • Los template literals permiten crear cadenas multilínea sin necesidad de usar caracteres especiales como \n para los saltos de línea.
   • Ejemplo:

      
     1let texto = `Esta es una línea.
     2Y esta es otra línea.`;
     3console.log(texto);
     Salida de consola
     Esta es una línea.
     Y esta es otra línea.

4. Incorporación de Comillas:

   • Con template literals, puedes incluir comillas simples o dobles dentro de la cadena sin necesidad de escaparlas.
   • Ejemplo:

      
     1let frase = `Ella dijo: "Hola, ¿cómo estás?"`;
     2console.log(frase); // Muestra Ella dijo: "Hola, ¿cómo estás?"
     Salida de consola
     Ella dijo: "Hola, ¿cómo estás?"

5. Funciones de Plantilla (Tagged Templates):

   • Puedes usar funciones especiales llamadas tag functions para procesar un template literal antes de convertirlo en una cadena final. Aunque es una característica avanzada, es útil en situaciones como la internacionalización.
   • Ejemplo básico:

      
     1function etiqueta(literals, ...values) {
     2  return literals[0] + values[0] + literals[1] + values[1];
     3}
     4
     5let nombre="Juan";
     6let a = 5;
     7let b = 2;
     8let mensaje = etiqueta`Hola, ${nombre}. Tienes ${a + b} puntos.`;
     9console.log(mensaje); // Muestra "Hola, Juan. Tienes 15 puntos."
     Salida de consola
     Hola, Juan. Tienes 7