Single quote or double quote in javascript

Question

I always see a write style in javascript but I don't know why code like this. For example, I have a variable.

   var topic = "community";

And when I learned javascript I saw someone coded in jQuery like this, some code in section.

 :contains("' + topic + '")

But I think it can code just like this.

  :contains(topic)

Or :contains("topic")

What the differences between above three ?

Duplicate: http://stackoverflow.com/questions/242813/when-to-use-double-or-single-quotes-in-javascript — Jamie Hutber, Jul 12 '13 at 06:53
I think the whole code was something like `.find(':contains("' + topic + '")')`. — Ja͢ck, Jul 12 '13 at 06:59
In that case he is using topic as a variable if you follow the single and double quotes from left to right the end result is going to be .find(':contains("community")') — Michael, Jul 12 '13 at 07:14

bipen · Answer 1 · 2013-07-12T06:59:15.207

6

:contains("topic")

this search for elements that contains "topic" string

where as

 var topic = "community";
 :contains(topic)

topic here becomes "community"..so it searchs for element that contains "community";

well for this

:contains("' + topic + '")

i guess the code is incomplete..

 $('div:contains("' + topic + '")')..; //div for example sake

this becomes

 $('div:contains("community")')..; //<-- just to make sure the string is encoded with `""`

edited Jul 12 '13 at 06:59

answered Jul 12 '13 at 06:53

bipen

36,319
9
49
62

Isn't the second case a CSS syntax error instead of showing an element that contains community? (doesn't CSS require quoting of the string?) – slebetman Jul 12 '13 at 06:56
@slebetman Nope. You can pass URLs and stuff without quotes, although bear in mind this isn't strictly CSS, but the Sizzle selector engine used by jQuery which provides a CSS-like API – Bojangles Jul 12 '13 at 07:09

score 0 · Answer 2 · answered Jul 12 '13 at 06:56

0

:contains("' + topic + '") will look for the string '(VALUE of topic)', including the single quotes.

:contains(topic)

will look for the value of topic, with no surrounding quotes.

:contains("topic")

will look for literally topic.

answered Jul 12 '13 at 06:56

PunDefeated

566
5
18

score 0 · Answer 3 · answered Jul 12 '13 at 06:57

There is no difference between single quotes and double quotes, both are used to mark an element as a string.

var s = "hello" 
var m = 'hello'
m === s // true

the other example refers to escaping a string, in the case of:

contains("' + topic + '")

topic actually references a variable and not a string, therefore the quotes must be escaped in order for the program to get access to the value of the variable. otherwise it would not read the value of the variable topic but simply print the string "topic".

score 0 · Answer 4 · answered Jul 12 '13 at 07:09

Single quotes vs double quotes usually has to do with whether or not string replacement will happen, but in JS it doesn't matter as far as I know

the difference between the 3 is that the first one is a variable assignment where string replacement can happen. the second one is passing a string as an argument and the third one is passing the variable or constant topic

var topicOne = "Community1";

function write(toOutput) {
    document.write(toOutput);
}

write(topicOne);
write("topicOne");
write('topicOne');

so here is what the 3 will output:

Community1
topicOne
topicOne

In PHP however the same code will act differently because the double quote implies string replacement

<?php
$topicOne = "community1";
$topicTwo = "community2$topicOne";


function write($toOutput) {
     print $toOutput;
}
write($topicOne);
write("$topicOne");
write('$topicOne');
write($topicTwo);
write("$topicTwo");
write('$topicTwo');
?>

will produce a different output

community1
community1
$topicOne
community2community1
community2community1
$topicTwo

see where the difference is?

Single quote or double quote in javascript

4 Answers4