Strings in ES6 Blog
El uso de Strings en JavaScript siempre ha sido tedioso, sobre todo cuando tenemos que remplazar valores o generar dinámicamente algún texto, ES6 pinta muy bien en cuanto al manejo de strings ya que ahora podemos definir templates y remplazar los valores de una manera muy sencilla.
Los siguientes ejemplos funcionarán correctamente en Chrome 41+, asegúrate de probarlos en esta versión.
Sustitución de Strings
Para sustituir un string dentro de otro podemos hacerlo de la siguiente manera.
var name = 'John Doe'; console.log(`Hola ${name}! ¿Cómo estas?`); //=> Hola John Doe! ¿Cómo estas?
- En primer lugar el string que remplaza la variable name está definido mediante back-ticks (`...`) en lugar de usar comillas simples ('...') o dobles ("...").
- Para evaluar variables simplemente usamos ${...}.
Como se puede apreciar esto nos abre muchas posibilidades, de hecho esta técnica la tenemos disponible en lenguajes como Ruby o Python, esta genial que ahora la tendremos disponible en JavaScript.
Evaluación de expresiones
No solamente podemos remplazar variables, también podemos definir expresiones y evaluarlas directamente en el template.
var x = 1, y = 2; console.log(`${x} + ${y} = ${x + y}`); //=> 1 + 2 = 3
También podemos ejecutar funciones directamente desde el template.
function text(){ return 'persona agria'; } console.log(`Eres una ${text()}!`); //=> Eres una persona agria!
Básicamente podemos poner cualquier expresión y será evaluada correctamente! Esto es una característica que personalmente extrañaba tener en JavaScript.
Soporte
Como ya mencioné al principio, esta nueva característica de ES6 funciona correctamente en Chrome 41+, pero también en IE Tech Preview, Firefox 35+ y io.js. Si quisieras usarla actualmente en producción te recomiendo utilizar los transpilers, los más populares soportan esta característica.
Happy coding!
Se el primero en comentar!