Concatenating strings with `if` statements in JavaScript

javascript string concatenation string-concatenation
木川 炎星 picture 木川 炎星 · Sep 8, 2011 · Viewed 39.3k times · Source

I'm attempting to set up a script to concatenate some variables inside a string if they exist, in order to place the appropriate metadata tags into a rendered HTML document.

My concatenation code is:

data = "<html>\n<head>\n" + "</head>\n<body>\n\n" + paras.join("\n\n") + "\n\n</body>\n</html>";

I'm trying to add if statements like the following into it (between the first and second items):

if (typeof metadata_title !== "undefined") {
    "<title>" + metadata_title + "</title>\n"
}
if (typeof metadata_author !== "undefined") {
    "<meta name=\"author\" content=\"" + metadata_author + "\"></meta>\n"
}
if (typeof metadata_date !== "undefined") {
    "<meta name=\"date\" content=\"" + metadata_date + "\"></meta>\n"
}

But I can't add any of these statements directly into the concatenation code (it throws an error: Unexpected token ().

How best would I go about adding statements such as these into my concatenation string?

Answer

bluish picture bluish · Sep 8, 2011

I'd use a ternary operator:

data = "<html>\n"
     + "<head>\n" 
     + ( typeof metadata_title  !== "undefined" ?  "<title>" + metadata_title + "</title>\n"                             : "" )
     + ( typeof metadata_author !== "undefined" ?  "<meta name=\"author\" content=\"" + metadata_author + "\"></meta>\n" : "" )
     + ( typeof metadata_date   !== "undefined" ?  "<meta name=\"date\" content=\"" + metadata_date + "\"></meta>\n"     : "" )
     + "</head>\n"
     + "<body>\n"
     + "\n"
     + paras.join("\n\n")
     + "\n"
     + "\n"
     + "</body>\n"
     + "</html>"
;

Related questions

Fast way to concatenate strings in nodeJS/JavaScript

I understand that doing something like var a = "hello"; a += " world"; It is relatively very slow, as the browser does that in O(n) . Is there a faster way of doing so without installing new libraries?

Read More
is the + operator less performant than StringBuffer.append()

On my team, we usually do string concatentation like this: var url = // some dynamically generated URL var sb = new StringBuffer(); sb.append("<a href='").append(url).append("'>click here</a>"); Obviously the following is …

Read More
What does ${} (dollar sign and curly braces) mean in a string in Javascript?

I haven't seen anything here or on MDN. I'm sure I'm just missing something. There's got to be some documentation on this somewhere? Functionally, it looks like it allows you to nest a variable inside a string without doing concatenation …

Read More