En JavaScript, los template strings permiten incrustar expresiones dentro de strings, lo que también se conoce como interpolación de strings.
Esta característica amplía las capacidades del objeto global String integrado.
Puedes crear template strings en JavaScript si envuelves el texto entre comillas invertidas. No solo permiten que el texto incluya saltos de línea y otros caracteres especiales, sino que también 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 un template string. El ${...} es el marcador de posición que se usa para la sustitución.
Cualquier tipo que no sea string se convierte implícitamente en string.
Este tema se trata en el concepto de conversión de tipos.
Con los template strings se puede usar todo tipo de expresiones.
const track = 'JavaScript';
`This track on exercism.org is ${track.toUpperCase()}.`;
// => This track on exercism.org is JAVASCRIPT.
Cuando necesitas que los strings tengan formato de varias líneas:
`This is an example of using template
strings to accomplish multiple
lines`;
Con las capacidades 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 corta de escribir una sentencia if/else.
La sintaxis es condition ? consequent-expression : alternative-expression.
Si la condición es truthy, se devuelve el operando que está a la izquierda de los dos puntos.
De lo 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 escribirás código para ayudar a una empresa de letreros a crear mensajes personalizados para sus letreros.
Implementa la función buildSign(occasion, name) que acepta un string como parámetro occasion y un string que contiene el nombre de alguien como parámetro name.
Los dos parámetros se insertarán en una plantilla de string para mostrar el mensaje en el letrero.
buildSign('Birthday', 'Rob');
// => "Happy Birthday Rob!"
Implementa la función buildBirthdaySign(age) que acepta una edad y, según esa edad, determina parte del mensaje del letrero.
Si la edad es 50 o más, el letrero se referirá a la persona como mature; de lo contrario, se referirá a ella como young.
El resultado esperado exacto 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 de tipo número, y usa la interpolación de strings para crear una frase para un letrero que usa 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 que contiene el contenido del letrero y un string que representa la moneda.
El letrero 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 costo de crear el letrero, escrito con dos dígitos después del punto decimal, 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.