Hola comunidad de Platzi! Me animé a realizar esta parte del proceso porque deseo explicarles el uso de los Templates literals, una herramienta muy útil a la hora de concatenar strings con variables sin necesidad de utilizar el operador de suma (+).
Recordemos primero cómo aprendimos a concatenar el valor de una variable con un texto:
letnombre = "Michael"letapellido = "White"
console.log("Mi nombre es " + nombre + " " + apellido )
// "Mi nombre es Michael White"
Básicamente estamos “sumando” al texto que va imprimirse en el console.log las variables que se crearon anteriormente para lograr mostrar el nombre completo. Sin embargo, como ya sabemos es necesario inclusive agregar el espacio entre las variables nombre y apellido (nombre + " " + apellido) lo cual podría resultar engorroso en el caso de que necesitaramos agregar más variables, por ejemplo.
¡En este punto es donde los Template Literals cobran vida y le dan un sentido a las nuestras! Pasaré primero a realizar el ejemplo del template literal siguiendo la misma dinámica del anterior:
let nombre = "Michael"let apellido = "White"console.log(`Mi nombre completo es ${nombre}${apellido}`)
// Mi nombre completo es Michael White
OMG, ¿qué acaba de pasar aquí? Esta es la magia, lo primero que debemos de hacer para empezar a emplear los template literals es escribir entre comillas invertidas (alt + 96) nuestro string. Dentro de nuestras comillas no tendremos que utilizar el signo de suma (+) para concatenar nuestras variables. En cambio, cuando necesitemos agregarlas al texto añadiremos lo siguiente: ${<ins>nombre variable</ins>}. ¡Así de sencillo es! En adición, te dejo un ejemplo con funciones para expandir la imaginación de cómo poder utilizar esta básica pero valiosa herramienta:
functioncompleteName(name, lastName) {
return name + lastName
}
functionsaludo(name, lastName, nickname) {
let nombre = completeName(name, lastName)
console.log(`Me llamo ${nombre} pero podrías decirme ${nickname}`)
}
saludo("Michael", "White", "MrWhite")
// "Me llamo Michael White pero podrías decirme MrWhite"
Esto ya es un ABUSO! Primero creamos una función que recibe los párametros de -name- y -lastName- (para poder cambiar su valor en el caso de que se requiera) Debes estar atento que esa función tiene un return que me sirve para guardar el resultado de la suma en la variable nombre de la segunda función, la cual tiene los mismos parámetros y -nickname-. En ese punto ya tengo las variables que necesito concatenar, así que procedo a generar mi template donde incluyo la variable nombre porque contiene la suma del nombre+apellido y por último el nickname.
¡Eso es todo, chicos y chicas! Espero haber servido de ayuda. Para mí fue un placer compartirles esta pequeña explicación respecto a una de las herramientas que considero como más útiles a la hora de generar nuestros strings concatenados. Bye!