У меня есть следующий код в Ruby. Я хочу преобразовать этот код в JavaScript. каков эквивалентный код в JS?
text = <<"HERE"
This
Is
A
Multiline
String
HERE
У меня есть следующий код в Ruby. Я хочу преобразовать этот код в JavaScript. каков эквивалентный код в JS?
text = <<"HERE"
This
Is
A
Multiline
String
HERE
ECMAScript 6 (ES6) вводит новый тип литерала, а именно шаблонные литералы , У них много функций, переменная интерполяция среди других, но самое главное для этого вопроса, они могут быть многострочными.
Строковый литерал ограничивается обратные кавычки :
var html = `
<div>
<span>Some HTML here</span>
</div>
`;
(Примечание: я не сторонник использования HTML в строках)
Поддержка браузера в порядке , но вы можете использовать transpilers чтобы быть более совместимым.
Javascript не имеет синтаксиса здесь-документа. Тем не менее, вы можете ускользнуть от буквенной новой строки:
"foo \
bar"
Как упоминается в первом ответе, с ES6 / Babel вы можете теперь создавать многострочные строки просто используя обратные ссылки:
const htmlString = `Say hello to
multi-line
strings!`;
Интерполирующие переменные являются популярной новой функцией, которая поставляется с строками с ограниченным типом:
const htmlString = `${user.name} liked your post about strings`;
Это просто сводится к конкатенации:
user.name + ' liked your post about strings'
Руководство по стилю JavaScript в Google рекомендует использовать конкатенацию строк вместо escape-строк:
Не делай это:
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.';
Пробел в начале каждой строки нельзя безопасно удалить во время компиляции; пробел после косой черты приведет к сложным ошибкам; и в то время как большинство движков сценариев поддерживают это, он не является частью ECMAScript.
Вместо этого используйте конкатенацию строк:
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.';
шаблон text = <<"HERE" This Is A Multiline String HERE
недоступен в js (я помню, как много использовал его в старые добрые дни Perl).
Чтобы следить за сложными или длинными многострочными строками, я иногда использую шаблон массива:
var myString =
['<div id="someId">',
'some content<br />',
'<a href="#someRef">someRefTxt</a>',
'</div>'
].join('\n');
или анонимный шаблон уже показал (escape newline), который может быть уродливым блоком в вашем коде:
var myString =
'<div id="someId"> \
some content<br /> \
<a href="#someRef">someRefTxt</a> \
</div>';
Вот еще один странный, но «трюк», 1 :
var myString = (function () {/*
<div id="someId">
some content<br />
<a href="#someRef">someRefTxt</a>
</div>
*/}).toString().match(/[^]*\/\*([^]*)\*\/\}$/)[1];
внешнее редактирование: jsfiddle
[ дополнение 2015 ]
ES6 поддерживает привязку строк по нескольким линиям, используя строковые строки :
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 Примечание: это будет потеряно после сведения / обфускации кода
Вы Можно имеют многострочные строки в чистом JavaScript.
Этот метод основан на сериализации функций, которая определяемый как зависящий от реализации , Он работает в большинстве браузеров (см. Ниже), но нет гарантии, что он все равно будет работать в будущем, поэтому не полагайтесь на него.
Используя следующую функцию:
function hereDoc(f) {
return f.toString().
replace(/^[^\/]+\/\*!?/, '').
replace(/\*\/[^\/]+$/, '');
}
У вас могут быть следующие документы:
var tennysonQuote = hereDoc(function() {/*!
Theirs not to make reply,
Theirs not to reason why,
Theirs but to do and die
*/});
Этот метод успешно протестирован в следующих браузерах (не указано = не проверено):
Однако будьте осторожны с вашим minifier. Он имеет тенденцию удалять комментарии. Для Компрессор YUI , комментарий, начинающийся с /*!
(например, тот, который я использовал) будет сохранен.
Я думаю, что реальный решение было бы использовать CoffeeScript ,
Вы можете сделать это...
var string = 'This is\n' +
'a multiline\n' +
'string';
Я придумал этот очень сложный метод многослойной струны. Поскольку преобразование функции в строку также возвращает любые комментарии внутри функции, вы можете использовать комментарии в качестве своей строки, используя многострочный комментарий / ** /. Вам просто нужно обрезать концы, и у вас есть ваша строка.
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)
I'm surprised I didn't see this, because it works everywhere I've tested it and is very useful for e.g. templates:
<script type="bogus" id="multi">
My
multiline
string
</script>
<script>
alert($('#multi').html());
</script>
Does anybody know of an environment where there is HTML but it doesn't work?
I solved this by outputting a div, making it hidden, and calling the div id by jQuery when I needed it.
e.g.
<div id="UniqueID" style="display:none;">
Strings
On
Multiple
Lines
Here
</div>
Then when I need to get the string, I just use the following jQuery:
$('#UniqueID').html();
Which returns my text on multiple lines. If I call
alert($('#UniqueID').html());
I get:
Using script tags:
<script>...</script>
block containing your multiline text into head
tag;get your multiline text as is... (watch out for text encoding: UTF-8, ASCII)
<script>
// pure javascript
var text = document.getElementById("mySoapMessage").innerHTML ;
// using JQuery's document ready for safety
$(document).ready(function() {
var text = $("#mySoapMessage").html();
});
</script>
<script id="mySoapMessage" type="text/plain">
<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:typ="...">
<soapenv:Header/>
<soapenv:Body>
<typ:getConvocadosElement>
...
</typ:getConvocadosElement>
</soapenv:Body>
</soapenv:Envelope>
<!-- this comment will be present on your string -->
//uh-oh, javascript comments... SOAP request will fail
</script>
I like this syntax and indendation:
string = 'my long string...\n'
+ 'continue here\n'
+ 'and here.';
(but actually can't be considered as multiline string)
There are multiple ways to achieve this
1. Slash concatenation
var MultiLine= '1\
2\
3\
4\
5\
6\
7\
8\
9';
2. regular concatenation
var MultiLine = '1'
+'2'
+'3'
+'4'
+'5';
3. Array Join concatenation
var MultiLine = [
'1',
'2',
'3',
'4',
'5'
].join('');
Performance wise, Slash concatenation (first one) is the fastest.
Refer this test case for more details regarding the performance
Update:
With the ES2015, we can take advantage of its Template strings feature. With it, we just need to use back-ticks for creating multi line strings
Example:
`<h1>{{title}}</h1>
<h2>{{hero.name}} details!</h2>
<div><label>id: </label>{{hero.id}}</div>
<div><label>name: </label>{{hero.name}}</div>
`
There's this library that makes it beautiful:
https://github.com/sindresorhus/multiline
var str = '' +
'<!doctype html>' +
'<html>' +
' <body>' +
' <h1> unicorns</h1>' +
' </body>' +
'</html>' +
'';
var str = multiline(function(){/*
<!doctype html>
<html>
<body>
<h1> unicorns</h1>
</body>
</html>
*/});