Strings multi-línea en Javascript

A veces es necesario asignar un texto largo, con varias líneas, a una variable. Si intentamos simplemente dividir el texto en varias líneas, fallará:

//Esta forma de hacerlo producirá un error
var myText = "Este es un texto muy largo que queremos 
              formatear en varias líneas. Un trozo de HTML 
              también sería un buen ejemplo de la necesidad 
              de asignar texto de varias líneas en una variable.";

Obtenemos el error:

SyntaxError: unterminated string literal

Hay dos formas muy comunes de hacerlo correctamente:

1. Utilizando el código de escape ('\') antes del salto de línea
2. Concatenando los strings de cada línea

Código de escape ('\') antes del salto de línea

El código sería.

var myText = "Este es un texto muy largo que queremos \
              formatear en varias líneas. Un trozo de HTML \
              también sería un buen ejemplo de la necesidad \
              de asignar texto de varias líneas en una variable.";

Esto funciona pero tiene algunos detractores porque no estaba en el estándar (en ECMAscript 5 sí se ha incluido) y porque los espacios en blanco después del código de escape pueden generar errores. Además algunos navegadores mantienen el salto de línea como parte del texto mientras otros lo eliminan ( en HTML esto no influye en el texto que veremos en pantalla).

En ECMAscript 3 no estaba permitido:

A LineTerminator character cannot appear in a string literal, even if preceded by a backslash '\'.

Pero en ECMAscript 5 sí seccion 7.8.4:

"A line terminator character cannot appear in a string literal, except as part of a LineContinuation to produce the empty character sequence."

Lo que el estándar llama LineContinuation sería la secuencia de escape junto con el final de línea (salto de línea): '\' + <LineTerminator>.

Es importante tener en cuenta que los espacios en blanco que introducimos para indentar las líneas formarán parte del string. Normalmente no es un problema porque en HTML se mostrarán como un solo espacio, pero este comportamiento se puede modificar.

La guia de estilo de Google recomienda no utilizar esta técnica porque:

" Los espacios en blanco al principio de cada línea no podrán ser eliminados con seguridad en procesos de compilación; los espacios en blanco despues de la barra (escape) pueden producir errores difíciles de encontrar y, aunque la mayoría de los intérpretes lo soportan, no es parte de ECMAScript."

La última frase hemos visto que ya no tendría sentido, pero, en cualquier caso, Google recomienda utilizar strings concatenados como veremos a continuación.

Concatenando strings

El código sería:

var myText = "Este es un texto muy largo que queremos" +
              "formatear en varias líneas. Un trozo de HTML" +
              "también sería un buen ejemplo de la necesidad" +
              "de asignar texto de varias líneas en una variable.";

Esta es la solución estándar sin discusión. Funcionará perfectamente en todas las implementaciones de JavaScript porque es una simple concatenación de strings y evita los problemas con los espacios en blanco del método anterior. Evitamos también cualquier problema/diferencia que pueda surgir al minificar el código y eliminar los saltos de línea.

ECMAscript 6 tendrá strings multilínea

EcmaScript 6 introduce una notación nueva para soportar strings multilínea: las comillas hacia atrás.

var myText = `Say hello to 
  multi-line
  strings!`;

Fuentes:
StackOverflow: creating multiline strings in javascript
StackOverflow: add carriage returns to string for readability