Какой самый простой способ написать многострочную строку в JavaScript?

На самом деле не нужно добавлять новые строки, просто что-то читаемое.

Что-нибудь лучше, чем это?

str = "line 1" +
      "line 2" +
      "line 3";

9 ответов

Решение

Почти идентичен ответу НикФитц:

var str = [""
    ,"line 1"
    ,"line 2"
    ,"line 3"
].join("");
// str will contain "line1line2line3"

Разница в том, что код немного более удобен в обслуживании, поскольку строки можно переупорядочивать независимо от того, где находятся запятые. Нет синтаксических ошибок.

Мне нравится эта версия (отличается от вашей только в форматировании кода):

var str = "line 1"
        + "line 2"
        + "line 3";

Вы могли бы сделать

str = "\
line 1\
line 2\
line 3";

Как упоминалось в комментариях, парсеры javascript справляются с этим нормально (он работает во всех основных браузерах), но официально не является частью синтаксиса скрипта ECMA. Как таковой он может работать или не работать со компрессорами, средствами проверки ошибок и не гарантированно работать в браузерах.

Это может быть более читабельным, но это не лучший способ сделать это. Возможно, скрипт ECMA когда-нибудь будет поддерживать что-то вроде C#'s @"".

FYI. То, как вы предлагаете это, является правильным и лучше, чем другие ответы. JsLint только проверяет вашу версию.

var str = [
    "line 1",
    "line 2",
    "line 3"
].join("");
// str will contain "line1line2line3"

Если вы на самом деле хотите перевод строки в строке, то замените .join("") с .join("\n")/

Последовательно.

Какой бы путь вы ни выбрали, делайте это точно так же, как и во всем приложении. Если вы работаете с приложением, в котором уже написан код, примите соглашение, которое они установили, и придерживайтесь его.

Да! Вы можете использовать символ \, чтобы JavaScript игнорировал символы конца строки.

str = 'line 1 \
line 2 \
line 3';

Однако, как отметил Эльзо Валуги, это не будет подтверждено использованием JSLint.

Это будет работать только в браузерах с поддержкой E4X - хотелось бы использовать его в IE

var str = <><![CDATA[

   Look, a multi-line
   string! < " // ' ? &

]]></>.toString();

Вот тот, который может быть полезен при разработке при использовании Chrome.

function FSTR(f) {
    // remove up to comment start and trailing spaces and one newline
    s = f.toString().replace(/^.*\/\* *\r?\n/,"");
    // remove the trailing */} with preceeding spaces and newline
    s = s.replace(/\n *\*\/\s*\}\s*$/,"")
    return s;
}

s = FSTR(function(){/*
uniform vec2 resolution;
uniform float time;

void main(void)
{
    vec2 p = -1.0 + 2.0 * gl_FragCoord.xy / resolution.xy;
    vec2 cc = vec2( cos(.25*time), sin(.25*time*1.423) );
    ...
    float color = sqrt(sqrt(dmin))*0.7;
    gl_FragColor = vec4(color,color,color,1.0);
}
*/});

Это не работает для Firefox, хотя работает в Chrome.

Пример использования будет для написания / тестирования шейдеров webgl. Во время разработки работать с этим гораздо приятнее, и позже вы всегда можете выполнить это с помощью простого регулярного выражения, которое преобразует этот синтаксис в кросс-браузерную версию.

Другие вопросы по тегам