在JavaScript中创建多行字符串

我在Ruby中有以下代码。 我想将此代码转换为JavaScript。 JS中的等效代码是什么？

text = <<"HERE"
This
Is
A
Multiline
String
HERE

---

更新：

ECMAScript 6（ES6）引入了一种新的文字，即模板文字 。 它们有许多特征，其中包括可变插值，但对于这个问题最重要的是，它们可以是多行的。

模板文字由反引号分隔：

var html = `
  <div>
    <span>Some HTML here</span>
  </div>
`;

（注意：我不主张在字符串中使用HTML）

浏览器的支持是可以的，但你可以使用转译器来更加兼容。

---

原始ES5答案：

Javascript没有here-document语法。 然而，你可以转义字面换行符，它接近了：

"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'

原始ES5答案：

Google的JavaScript风格指南建议使用字符串连接而不是转义换行符：

不要这样做：

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');

或匿名模式已经显示（换行换行），这可能是你的代码中的一个丑陋的块：

    var myString = 
       '<div id="someId"> 
some content<br /> 
<a href="#someRef">someRefTxt</a> 
</div>';

这是另一个奇怪的但有效的'trick'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注意：缩小/混淆代码后会丢失

链接地址: http://www.djcxy.com/p/799.html

上一篇: Creating multiline strings in JavaScript

下一篇: What is the best way to iterate over a Dictionary in C#?