Anuncios

Bienvenidos sean a este post, hoy analizaremos un tema que vimos en el post anterior.

Anuncios

Las caracteristicas mencionadas en el titulo fueron implementadas a partir del ES2015 y las hemos estado usando un poco sin querer en posts anteriores, si bien sabemos que en Javascript normal podemos representar literales de texto mediante la comilla simple (‘) o la ccomilla doble («) gracias al ES2015 se nos permite utilizar otra opcion mas como es el acento grave (`), veamos un ejemplo simple:

`Cadena de texto literal con acento grave`
Anuncios

Si vienen de posts anteriores notaran que hemos usado esta forma de pasar un literal en algunos ejemplos, este tipo de cadena/literal se la denomina como «template string» y esta es la que nos permite usar valores dentro de la misma mediante el siguiente operador:

${valor}
Anuncios

Siendo valor tanto una variable como un objeto o mismo la devolucion de una funcion, veamos un ejemplo de multiline del post anterior:

`<html>
<head><title>Hola, Mundo!</title></head>
<body><h1>Hola, Mundo!</h1>
<p><a href='/osinfo'>Info SO</a></p>
</body></html>`
Anuncios

Tomemos este caso y veamos como se debia hacer antes de disponer de esta tecnica:

["<html><head><title>Hola, Mundo!</title></head>",
"<body><h1>Hola, Mundo!</h1>",
"<p><a href='/osinfo'>Info SO</a></p>",
"</body></html>"].join('\n');
Anuncios

En este caso unimos a todos mediante el join y como «unidor» usaremos la secuencia de escape para nueva linea, pero que sucedia cuando teniamos datos? bueno tomemos una porcion de la segunda funcion:

[ ...
 "<tr><th>OS TYPE</th><td>{tipo} {plataf} ${arquit} ${lanzam}</td></tr>",
  ...].join('\n');
Anuncios

En este caso es muy similar a lo que vimos anteriormente pero aqui mostrabamos informacion relacionada al ordenador, para este ejemplo solo mostramos lo relacionado al tipo de Sistema Operativo pero de esta forma no mostrara ningun dato sino que debemos agregar lo siguiente:

[ ...
"<tr><th>OS TYPE</th><td>{tipo} {plataf} ${arquit} ${lanzam}</td></tr>",
...].join('\n')
.replace("{tipo}", os.type())
.replace("{plataf}", os.platform())
.replace("{arquit}", os.arch())
.replace("{lanzam}", os.release());
Anuncios

Aqui debemos utilizar al metodo replace para que busque las referencias que pasamos entre llaves y a este le asignaremos la devolucion de cada uno de los metodos, complicado no? comparemos como lo teniamos en el codigo anterior:

` ...
<tr><th>OS TYPE</th><td>${os.type()} ${os.platform} ${os.arch()} ${os.release()}</td></tr>
  ... `
Anuncios
Anuncios

Ahora mediante el operador que mencionamos al comienzo no es necesario tener que hacer un llamado al metodo replace como debiamos hacer antes, pero esta forma de trabajar puede recurrir en un problema de seguridad, especialmente cuando no tenemos un control completo de como se ingresa la informacion, por citar un ejemplo si este fuera ingresado por el usuario puede tener la posibilidad de poder introducir un codigo malicioso que puede ser perjudicial para nuestra aplicacion, dado que son solo numeros y texto, pero cuando tenemos una situacion como la actual donde la fuente de informacion es un modulo que extrae informacion de nuestro equipo no existe ningun riesgo, por eso a la hora de trabajar con esto deben tener muchas cosas en cuenta, si se preguntan como solucionar el inconveniente antes mencionado, una posibilidad hubiera sido convertir lo ingresado a HTML y ahi no se podria ejecutar nada, pero esto es solo el principio de la verdadera aventura que se convertira nuestro paseo en node.js.

Anuncios

En resumen, hoy hemos visto a multiline (multi-lineas) y template string, dos conceptos que se agregaron a partir del ES2015, hemos conocido un poco mas a pesar de haberlo usado en otras ocasiones, hemos visto como se hacia antiguamente, asi como tambien como nos facilitan las cosas y un posible riesgo de usarlo si no conocemos desde donde se obtienen los datos, espero les haya sido de utilidad sigueme en tumblr, Twitter o Facebook para recibir una notificacion cada vez que subo un nuevo post en este blog, nos vemos en el proximo post.

Anuncios
pp258

Donación

Es para mantenimento del sitio, gracias!

$1.50