Odd use of backslash in a Javascript string

Question

One of my colleagues used backslashes when setting the string value of a property in a JS object:

shareButtonsHtml : '\
    <span class="share-fb">\
        <a href="#" class="fb-share"><span class="fb-share-icon"></span>Share</a>\
        <span class="fb-share-count"><i></i><u></u>0</span>\
    </span>\
    <div class="share-twitter"> \
        <iframe class="share-twitter-iframe" \
                allowtransparency="true" frameborder="0" scrolling="no" \
                src="https://platform.twitter.com/widgets/tweet_button.html" \
                style="width:130px; height:20px;"></iframe> \
    </div> \
    <div class="share-google"> \
        <div class="g-plusone" data-size="small" data-annotation="none"></div> \
    </div>',

The only thing we do with this string is populate our social share buttons container when the user mouseovers them:

self.html(obj.shareButtonsHtml);

I know backslash is an escape character in JS. Can anyone explain why my colleague used them here? Surely he didn't need to escape the carriage return or line break? He's since moved on to another company, so I can't ask him!

Looks like he/she was doing `\` instead of closing the string `'` and then using `+` concatenation to start on a new line. — Mark Pieszak - Trilon.io, Jan 31 '13 at 15:08
See [How to create multiline strings in javascript](http://stackoverflow.com/questions/805107/how-to-create-multiline-strings) — Bergi, Jan 31 '13 at 15:09

Cerbrus · Accepted Answer · 2013-01-31T15:14:36.470

He's escaping newline characters.

That's required if you want multiline strings, otherwise JS wouldn't recognise the next line as part of the string.

So, yes, he did in fact "need to escape the carriage return or line break". That's exactly what he's doing there.

You can use string concatenation to spread strings over multiple lines, but that means extra operations each time you use the string. The performance difference not very significant, it's mostly a matter of preference.

The reason multiline stings don't normally work in JS is because the interpreter (in most cases*) adds a ; to the end of the line of code, if it isn't there already. This is why the ; is optional, but it also breaks multiline strings.

* An exception would be object / array literals, ;'s aren't added there, for example:

var obj = {
    a:1
}

score 4 · Answer 2 · answered Jan 31 '13 at 15:06

The backslashes are used to escape the newlines here. It can also be used in the command line for example.

David Walsh has written an excellent post about multiline javascript strings: http://davidwalsh.name/multiline-javascript-strings

It seems your colleague is actually using the preferred method above the 'slow and ugly' method using the plus (+) signs to concatenate the strings.

From the blog:

Adding a backslash at the end of each line tells the JavaScript engine that the string will continue to the next line, thus avoiding the automatic semicolon insertion annoyance.

Cheers Robin, I could only pick one answer but given yours an uptick. — And Finally, Jan 31 '13 at 16:06

score 1 · Answer 3 · answered Jan 31 '13 at 15:07

1

This simply allows him to define the string on multiple lines (the \ is escaping the "new line" character).

answered Jan 31 '13 at 15:07

Jan Hančič

53,269
16
95
99

Odd use of backslash in a Javascript string

3 Answers3