Plantillas de cadenas (template literals)
Las plantillas de cadenas son una manera fácil y moderna de concatenar variables en JavaScript. En vez de usar el signo + para unir palabras, usamos unas comillas especiales que se llaman comillas invertidas (`). Con las plantillas de cadenas, podemos poner variables directamente dentro de la cadena usando ${}. Así, no tenemos que preocuparnos por los espacios o el orden de las palabras.
Estructura básica
`texto1 ${variable1}`
`${variable1} texto1`
`texto1 ${variable1} texto2 ${variable2} texto3 ${variable3} ...`
Ejemplo:
var nombre = "Juan";
var deporte = "fútbol";
var text=`Entre todos los estudiantes, ${nombre} es el mejor en el ${deporte}` ;
Mira este ejemplo:
<html>
<head>
<title>template literals</title>
</head>
<body>
<script>
var nombre = "Juan";
var deporte ="fútbol";
var text=`Entre todos los estudiantes, ${nombre} es el mejor en el ${deporte}.`;
alert(text);
nombre = prompt("Introduce un nombre:");
deporte =prompt("Introduce un deporte:");
text=`Entre todos los estudiantes, ${nombre} es el mejor en el ${deporte}.`;
alert(text);
</script>
</body>
</html>
Actividad 3.1.A
Crea una nueva página HTML con el nombre "Act31A",
Define una variable llamada nombre que guarde el valor del prompt("¿Cuál es tu nombre? ") ;
Define una variable llamada enfermedad que guarde el valor del prompt("Escribe una enfermedad venérea:") ;
Define una variable llamada panaderia que guarde el valor del prompt("Escribe un producto de panaderia: ") ;
Define una variable llamada text que guarde la Plantillas de cadenas: `${nombre} tiene ${enfermedad} en el/la ${panaderia}` ;
Agrega una alerta para mostrar la variable text.
Actividad 3.1.B
Crea una nueva página HTML con nombre Act31B.
Define una variable llamada nombre que guarde el valor del prompt("¿Cuál es tu nombre? ") ;
Define una variable llamada tamaño que guarde el valor del prompt("El amor por tu colegio es GRANDE o PEQUEÑO: ") ;
Define una variable llamada organo que guarde el valor del prompt("Escribe un órgano reproductor:") ;
Define una variable llamada text que guarde la Plantillas de cadenas: `${nombre} tiene ${tamaño} el/la ${organo}` ;
Agrega una alerta para mostrar la variable text.