En JavaScript, las template strings permiten incrustar expresiones dentro de strings, algo que también se conoce como interpolación de strings.
Esta funcionalidad amplía las capacidades del objeto global String integrado en el lenguaje.
Puedes crear template strings en JavaScript encerrando el texto entre comillas invertidas. No solo permiten que el texto incluya saltos de línea y otros caracteres especiales, sino que además puedes incrustar variables y otras expresiones.
const num1 = 1;
const num2 = 2;
`Adding ${num1} and ${num2} gives ${num1 + num2}.`;
// => Adding 1 and 2 gives 3.
En el ejemplo anterior, las comillas invertidas (``) se usan para representar una template string. El ${...} es el marcador que se usa para la sustitución.
Cualquier tipo que no sea string se convierte en string de forma implícita.
Este tema se trata en el concepto conversión de tipos.
Con las template strings se puede usar cualquier tipo de expresión.
const track = 'JavaScript';
`This track on exercism.org is ${track.toUpperCase()}.`;
// => This track on exercism.org is JAVASCRIPT.
Cuando necesitas que los strings ocupen varias líneas:
`This is an example of using template
strings to accomplish multiple
lines`;
Gracias a las posibilidades de sustitución disponibles, también puedes introducir lógica en el proceso para determinar cuál debe ser el string de salida.
Un ejemplo de esto es incrustar un operador ternario.
Este operador es una forma abreviada de escribir una instrucción if/else.
La sintaxis es condition ? consequent-expression : alternative-expression.
Si la condición se evalúa como verdadera, se devuelve el operando que está a la izquierda de los dos puntos.
En caso contrario, el resultado de la expresión ternaria es el operando que está a la derecha de los dos puntos.
const grade = 95;
`You have ${grade > 90 ? 'passed' : 'failed'} the exam.`;
// => You have passed the exam.
En este ejercicio vas a escribir código para ayudar a una empresa de carteles a crear mensajes personalizados para sus carteles.
Implementa la función buildSign(occasion, name), que acepta un string como parámetro occasion y un string con el nombre de una persona como parámetro name.
Los dos parámetros se insertarán en una plantilla de string para generar el mensaje del cartel.
buildSign('Birthday', 'Rob');
// => "Happy Birthday Rob!"
Implementa la función buildBirthdaySign(age), que acepta una edad y, según esa edad, determinará parte del mensaje del cartel.
Si la edad es 50 o más, el cartel se referirá al usuario como mature; de lo contrario, se referirá a él como young.
La salida esperada exacta se muestra a continuación:
buildBirthdaySign(50);
// => "Happy Birthday! What a mature fellow you are."
buildBirthdaySign(45);
// => "Happy Birthday! What a young fellow you are."
Implementa la función graduationFor(name, year), que toma un nombre como parámetro de tipo string y un año como parámetro numérico, y usa la interpolación de cadenas para crear una frase para un cartel que emplea un salto de línea para separar las dos líneas del mensaje.
graduationFor('Hannah', 2022);
/* => "Congratulations Hannah!
Class of 2022"
*/
Implementa la función costOf(sign, currency), que toma un string con el contenido del cartel y un string que representa la moneda.
El cartel tiene un precio base de 20 en la moneda dada. Además, cada letra cuesta 2. (Los espacios en blanco se incluyen en el cálculo.)
La frase devuelta incluye el coste de crear el cartel, escrito con dos decimales, seguido del string de la moneda.
costOf('Happy Birthday Rob!', 'dollars');
// => "Your sign costs 58.00 dollars."
Regístrate en Exercism para aprender y dominar JavaScript con 37 conceptos159 ejercicios y mentoría humana real, todo gratis.