Sizzling Code
Sizzling Code

Reputation: 6080

putting javascript function in a string

I was wondering if there is any way to put this in a string.

function format(e) {
    if (!e.id) return e.text;
    if (e.avatar === "defaultAvatar.jpg") {
        return "<div class='select2TemplateImg'><span class='helper'></span> <img class='flag' src='" + baseURL + "uploads/users/d/defaultAvatar.jpg'/></div><div class='select2TemplateText'><p> " + e.text + "</p><p>" + e.username + "</p><p>" + e.cnic + "</p></div>"
    } else if (e.avatar != "defaultAvatar.jpg") {
        return "<div class='select2TemplateImg'><span class='helper'></span> <img class='flag' src='" + baseURL + "uploads/users/" + e.userid + "/" + e.avatar + "'/></div><div class='select2TemplateText'><p> " + e.text + "</p><p>" + e.username + "</p><p>" + e.cnic + "</p></div>"
    }
}

like

 var variableName = "FUNCTION-HERE";

Problem is in that function i have used both double quotes and single quotes and if i try to put it inside the string, then there is no support of triple quotes in javascript and i can not close the above function in simple javascript quotes (single or double) everything gets messed up.

Any idea how to achieve it?

Upvotes: 1

Views: 150

Answers (5)

user3459110
user3459110

Reputation: 7061

Use toString()

var myFunc = function(){
  console.log("here are double quotes", 'and here single');
}

console.log(myFunc.toString());

Or String (as an operator)

var myFunc = function(){
  console.log("here are double quotes", 'and here single');
}

console.log(String(myFunc));

It also takes 2 characters less than the previous version. It is a better method, IMHO.

A hackish way would be as following:

var myFunc = function(){
      console.log("here are double quotes", 'and here single');
}

console.log('' + myFunc);

//or 

console.log(myFunc + ''); //both are same

It works because of Javascript's automatic type casting. We are basically appending an empty string to the function which causes the function to be automatically cast to a string. It then adds the empty string but since the string is empty, no actual change is made to the string returned by casting the function.

Use this ONLY when golfing or in overly simple cases. It is not considered good practice.

Further, there are better ways to store functions, like wrapping them in an object. Or if you wanna pass them as arguments, you can do that directly by passing the function itself (without the parenthesis) since functions in javascipt are first class citizens.

Upvotes: 3

AVDW
AVDW

Reputation: 94

You can use + on the end of each sting if you want it formatted nicely in your file, then escape your double quotes with \

var variableName = 'function format(e) {'+
'if (!e.id) return e.text;'+
'if (e.avatar === "defaultAvatar.jpg") {'+
    'return "<div class=\'select2TemplateImg\'><span class=\'helper\'></span> <img class=\'flag\' src=\'" + baseURL + "uploads/users/d/defaultAvatar.jpg\'/></div><div class=\'select2TemplateText\'><p>"+ e.text +"</p><p>" + e.username + "</p><p>" + e.cnic + "</p></div>"'+
'} else if (e.avatar != "defaultAvatar.jpg") {'+
    'return "<div class=\'select2TemplateImg\'><span class=\'helper\'></span> <img class=\'flag\' src=\'" + baseURL + "uploads/users/" + e.userid + "/" + e.avatar + "\'/></div><div class=\'select2TemplateText\'><p> " + e.text + "</p><p>" + e.username + "</p><p>" + e.cnic + "</p></div>"'+
'}';

Personally I feel dirty doing it like that but it gets the job done.

Upvotes: 1

Ruben Nagoga
Ruben Nagoga

Reputation: 2218

Like this?

var variableName = 'function format(e) {\
    if (!e.id) return e.text;\
    if (e.avatar === "defaultAvatar.jpg") {\
        return "<div class=\'select2TemplateImg\'><span class=\'helper\'></span> <img class=\'flag\' src=\'" + baseURL + "uploads/users/d/defaultAvatar.jpg\'/></div><div class=\'select2TemplateText\'><p> " + e.text + "</p><p>" + e.username + "</p><p>" + e.cnic + "</p></div>"\
    } else if (e.avatar != "defaultAvatar.jpg") {\
        return "<div class=\'select2TemplateImg\'><span class=\'helper\'></span> <img class=\'flag\' src=\'" + baseURL + "uploads/users/" + e.userid + "/" + e.avatar + "\'/></div><div class=\'select2TemplateText\'><p> " + e.text + "</p><p>" + e.username + "</p><p>" + e.cnic + "</p></div>"\
    }\
}';

Upvotes: 4

Amadan
Amadan

Reputation: 198496

While this may not be what you directly asked about, you can also directly convert code into string:

function format(e) {
    if (!e.id) return e.text;
    if (e.avatar === "defaultAvatar.jpg") {
        return "<div class='select2TemplateImg'><span class='helper'></span> <img class='flag' src='" + baseURL + "uploads/users/d/defaultAvatar.jpg'/></div><div class='select2TemplateText'><p> " + e.text + "</p><p>" + e.username + "</p><p>" + e.cnic + "</p></div>"
    } else if (e.avatar != "defaultAvatar.jpg") {
        return "<div class='select2TemplateImg'><span class='helper'></span> <img class='flag' src='" + baseURL + "uploads/users/" + e.userid + "/" + e.avatar + "'/></div><div class='select2TemplateText'><p> " + e.text + "</p><p>" + e.username + "</p><p>" + e.cnic + "</p></div>"
    }
}
var someVariable = format.toString();

Upvotes: 1

Anik Islam Abhi
Anik Islam Abhi

Reputation: 25352

you can do it by escaping using '\'

var v = "function format(e) { if (!e.id) return e.text;if (e.avatar === \"defaultAvatar.jpg\") {return \"<div class='select2TemplateImg'><span class='helper'></span> <img class='flag' src='\" + baseURL +\"uploads/users/d/defaultAvatar.jpg'/></div><div class='select2TemplateText'><p> \" + e.text + \"</p><p>\" + e.username + \"</p><p>\" + e.cnic + \"</p></div>\"} else if (e.avatar != \"defaultAvatar.jpg\") {return \"<div class='select2TemplateImg'><span class='helper'></span> <img class='flag' src='\" + baseURL + \"uploads/users/\" + e.userid + \"/\" + e.avatar + \"'/></div><div class='select2TemplateText'><p> \"+ e.text + \"</p><p>\" + e.username + \"</p><p>\" + e.cnic + \"</p></div>\"}}";

Upvotes: 2

Related Questions