Double Quotes vs Single Quotes in JavaScript

By /
Different quotations in JS

You can use both single and double quotes in JavaScript.

There’s no specific rule that dictates which one you should use. This means you can choose the style that suits you the best.

let x = "John"
let y = 'John'

But in the name of consistency, I recommend sticking with one style, though.

Also, since ES6, you can also use template literals (backtick character) to create strings in JavaScript.

let z = `John`

However, the template literal is particularly useful when you need to embed values into strings.

let age = 20
let msg = `John is ${age} years old`

console.log(msg) // John is 20 years old

The Problem with Quotation Marks

The main issue with both single and double quotation marks in JavaScript arises when you need to use quotation marks inside a string.

Consider this example string:

console.log('Let's go')

Running this piece of code fails because of a syntax error:

Issues with single quotes

This error happens because JavaScript sees the string in two parts instead of a single string.

  1. 'Let'
  2. s go'

Here JavaScript thinks that the single quote in the word Let’s terminates the string.

An easy way to avoid this error is by using double quotes instead of single quotes:

console.log("Let's go")

Output:

Let's go

Escaping Strings in JavaScript

Sometimes you might need to use single quotes even if it causes a problem like the above.

For example, let’s say you want to have a string like this:

console.log("Then he said: "let's go"")

Output:

console.log("Then he said: "let's go"")
            ^^^^^^^^^^^^^^^^

SyntaxError: missing ) after argument list

To fix this issue, you need to use what’s called escaping.

In short, escaping means using a backslash character to encode particular characters to avoid misinterpretation.

In this case, you want to escape the double quotation mark character to avoid JavaScript misinterpreting it as ending the string.

Here’s what it looks like:

console.log("Then he said: \"let's go\"")

Output:

Then he said: "let's go"

Template Literals

As of ES6, JavaScript has a third way to specify strings—template literals.

A template literal string is wrapped inside a pair of backticks instead of single or double quotes.

For example:

let age = 32
let msg = `Alice is ${age} years old`

In the previous section, you learned how to use escaping to place both single and double quotes inside a string.

Another option to do this is by using the template literals.

For example:

let msg = `He said: "Let's go!"`
console.log(msg // He said: "Let's go!"

Running the above code would have failed had we used single or double quotes to create the message. But thanks to the template literals, the string was built successfully.

Which One Is Better: Single or Double Quotes?

Both single and double quotes are equally as great solutions to creating strings in JavaScript.

But there are some reasons why double quotes might be more desirable:

  1. Double quotation marks are already used in spoken language. For instance, in English, a double quotation mark identifies a passage of a quoted text.
  2. Double quotation marks require no escaping of apostrophes. For example “Let’s go to the beach” vs ‘Let\’s go to the beach’.
  3. Many other coding languages define strings with double quotes. For example, in PHP you can’t do backslash escaping with single-quote strings.
  4. In JavaScript, the JSON attribute labels and strings use double quotes. (Although the JSON string is wrapped around single quotes).

Thanks for reading. I hope you enjoy it! Happy coding!

Scroll to Top