Escribir una cadena de varias líneas en JavaScript

Harshit Jindal 12 octubre 2023
  1. Concatenar varias líneas en JavaScript
  2. Utilice el carácter de barra invertida \ para escapar de las líneas nuevas literales
  3. Utilice literales de plantilla para crear cadenas de varias líneas en JavaScript
Escribir una cadena de varias líneas en JavaScript

Este tutorial enseña cómo escribir una cadena de varias líneas en JavaScript. En la era anterior a ES6, no había soporte directo para cadenas de varias líneas en JavaScript. Hay varias formas de lograr esto, formas anteriores a ES6 que no eran tan buenas, y la forma ES6, la forma sintáctica del azúcar. Cubriremos todos estos métodos uno por uno.

Concatenar varias líneas en JavaScript

Podemos dividir la cadena en varias subcadenas y luego usar el signo + para concatenarlas y obtener la cadena única completa. De esta forma logramos dividir cuerdas en múltiples líneas y juntarlas en una sola cuerda al mismo tiempo.

const str = 'This is DelftStack' +
    ' We make cool How to Tutorials' +
    ' &' +
    ' Make the life of other developers easier.';

Producción :

"This is DelftStack We make cool How to Tutorials & Make the life of other developers easier."

Era la forma más simple y prometedora de escribir cadenas de varias líneas antes de que se introdujeran los literales de plantilla, pero este método no puede generar la cadena formada como cadenas de varias líneas y eso debe lograrse añadiendo una \n al final de cada línea.

Utilice el carácter de barra invertida \ para escapar de las líneas nuevas literales

Podemos agregar una barra invertida al final de cada línea para hacer una cadena de varias líneas entre comillas dobles/simples, ya que este carácter nos ayuda a escapar del carácter de nueva línea.

const str = 'This is DelftStack \
We make cool How to Tutorials \
& \
Make the life of other developers easier.';

Producción :

"This is DelftStack We make cool How to Tutorials & Make the life of other developers easier."

Así que escribimos la cadena dividida en varias líneas, pero juntamos la cadena unida, lo que nos ayuda a lograr nuestros objetivos, la salida de visualización correcta y la legibilidad del código. Pero no siempre se desea que deseemos cadenas que en realidad estén divididas en varias líneas, incluso cuando se muestran. Esto se logra mediante el uso de literales de plantilla en ES6.

Utilice literales de plantilla para crear cadenas de varias líneas en JavaScript

La plantilla literal es la nueva forma introducida por ES6 que nos ayuda a escribir cadenas de varias líneas con la ayuda de comillas inversas (este carácter ` se llama comillas inversas). Es, con mucho, la mejor solución, ya que no solo nos permite escribir cadenas de varias líneas, sino que también las imprime exactamente de la misma manera, lo que no era posible con ninguno de los métodos anteriores.

var str = `This is DelftStack 
We make cool How to Tutorials 
& 
Make the life of other developers easier.
`

Producción :

This is DelftStack 
We make cool How to Tutorials 
& 
Make the life of other developers easier.
Harshit Jindal avatar Harshit Jindal avatar

Harshit Jindal has done his Bachelors in Computer Science Engineering(2021) from DTU. He has always been a problem solver and now turned that into his profession. Currently working at M365 Cloud Security team(Torus) on Cloud Security Services and Datacenter Buildout Automation.

LinkedIn

Artículo relacionado - JavaScript String