Q
Tengo el siguiente código en Ruby. Quiero convertir este código en JavaScript. ¿Cuál es el código equivalente en JS?
text = <<"HERE"
This
Is
A
Multiline
String
HERE
A-1
ECMAScript 6 (ES6) introduce un nuevo tipo de literal, a saber, literales de plantilla. Tienen muchas características, interpolación variable entre otras, pero lo más importante para esta pregunta, pueden ser multilínea.
ECMAScript 6 (ES6) introdujo un nuevo tipo de texto, a saber
模板文字. Tienen muchas funciones, incluida la interpolación de variables, pero lo más importante para este problema es que pueden ser multilínea.
Un literal de plantilla está delimitado por comillas invertidas:
El texto de la plantilla está separado por comillas invertidas:
var html = `
<div>
<span>Some HTML here</span>
</div>
`;
(Nota: no estoy recomendando el uso de HTML en cadenas)
(Nota: no defiendo el uso de HTML en cadenas)
A-2
Como menciona la primera respuesta, con ES6 / Babel, ahora puede crear cadenas de varias líneas simplemente usando comillas invertidas:
Como se mencionó en la primera respuesta, con ES6 / Babel, ahora puede crear cadenas de varias líneas simplemente usando comillas invertidas:
const htmlString = `Say hello to
multi-line
strings!`;
La interpolación de variables es una nueva característica popular que viene con cadenas delimitadas por ticks inversos:
Las variables de interpolación son una nueva característica popular, con cadenas separadas por comillas invertidas:
const htmlString = `${
user.name} liked your post about strings`;
Esto simplemente se reduce a la concatenación:
Esto simplemente se convierte en concatenación:
user.name + ' liked your post about strings'
Respuesta original de ES5:
Respuesta original de ES5:
La guía de estilo de JavaScript de Google recomienda utilizar la concatenación de cadenas en lugar de escapar de las nuevas líneas:
Google的JavaScript样式指南Se recomienda utilizar la concatenación de cadenas en lugar de una nueva línea:
No hagas esto:
No hagas esto:
var myString = 'A rather long string of English text, an error message \
actually that just keeps going and going -- an error \
message to make the Energizer bunny blush (right through \
those Schwarzenegger shades)! Where was I? Oh yes, \
you\'ve got an error and all the extraneous whitespace is \
just gravy. Have a nice day.';
El espacio en blanco al principio de cada línea no se puede eliminar de forma segura en tiempo de compilación; los espacios en blanco después de la barra oblicua resultarán en errores complicados; y aunque la mayoría de los motores de secuencias de comandos admiten esto, no es parte de ECMAScript.
El espacio en blanco al principio de cada línea no se puede eliminar de forma segura en el momento de la compilación; los espacios después de la barra inclinada provocarán errores complicados; aunque la mayoría de los motores de secuencia de comandos admiten esta función, no forma parte de ECMAScript.
Utilice la concatenación de cadenas en su lugar:
Utilice la concatenación de cadenas:
var myString = 'A rather long string of English text, an error message ' +
'actually that just keeps going and going -- an error ' +
'message to make the Energizer bunny blush (right through ' +
'those Schwarzenegger shades)! Where was I? Oh yes, ' +
'you\'ve got an error and all the extraneous whitespace is ' +
'just gravy. Have a nice day.';
A-3
el patrón text = <<"HERE" This Is A Multiline String HEREno está disponible en js (recuerdo haberlo usado mucho en mis viejos tiempos de Perl).
Este modo
text = <<"HERE" This Is A Multiline String HEREno está disponible en js (recuerdo que lo usé mucho durante mi buen tiempo en Perl).
Para mantener la supervisión con cadenas de varias líneas complejas o largas, a veces uso un patrón de matriz:
Para supervisar cadenas de varias líneas complejas o largas, a veces se utiliza el modo de matriz:
var myString =
['<div id="someId">',
'some content<br />',
'<a href="#someRef">someRefTxt</a>',
'</div>'
].join('\n');
o el patrón anónimo ya mostrado (escape newline), que puede ser un bloque feo en su código:
O el modo anónimo (carácter de nueva línea) que se ha mostrado, que puede ser un bloque feo en el código:
var myString =
'<div id="someId"> \
some content<br /> \
<a href="#someRef">someRefTxt</a> \
</div>';
Aquí hay otro 'truco' extraño pero funcional1:
Este es otro "truco" extraño pero efectivo 1:
var myString = (function () {
/*
<div id="someId">
some content<br />
<a href="#someRef">someRefTxt</a>
</div>
*/}).toString().match(/[^]*\/\*([^]*)\*\/\}$/)[1];
ES20xx admite la extensión de cadenas en varias líneas mediante cadenas de plantilla:
ES20xx admite el uso de
模板字符串varias líneas字符串:
let str = `This is a text
with multiple lines.
Escapes are interpreted,
\n is a newline.`;
let str = String.raw`This is a text
with multiple lines.
Escapes are not interpreted,
\n is not a newline.`;
1 Nota: esto se perderá después de minimizar / ofuscar su código
1 Nota: Después de minimizar / ofuscar el código, este se perderá
A-4
141
Se me ocurrió este método muy manipulado de una cuerda de varias líneas. Dado que convertir una función en una cadena también devuelve cualquier comentario dentro de la función, puede usar los comentarios como su cadena usando un comentario multilínea / ** /. Solo tienes que recortar los extremos y ya tienes tu cuerda.
Se me ocurrió esta manipulación muy torpe de cuerdas de varias líneas. Dado que convertir una función en una cadena también devolverá cualquier comentario dentro de la función, puede usar comentarios de varias líneas / ** / para usar comentarios como una cadena. Solo necesitas recortar los extremos.
var myString = function(){
/*
This is some
awesome multi-lined
string using a comment
inside a function
returned as a string.
Enjoy the jimmy rigged code.
*/}.toString().slice(14,-3)
alert(myString)