Tutorials Tonight
Follow Us

JavaScript Escape Quotes


In this tutorial, you will learn how to escape quotes in JavaScript.

Why do we need to escape quotes?

To define a string in JavaScript we use single quotes (' ') or double quotes (" "). For example 'Hello World' or "Hello World".

var str1 = 'Hello World'; ✅
var str2 = "Hello World"; ✅

The problem arises when we want to display quotes within the string. For example, "The book "World" is on the table." or 'The book 'World is on the table.'.

var str1 = "The book "World" is on the table.""; ❌
var str2 = 'The book 'World is on the table.''; ❌

The above strings are not valid because when you write another quote within the string, javascript will think that it is the end of the string. And characters after the quote will cause an error.

One way to solve this problem is to use opposite quotes. This means if you want to show double quotes within the string then use single quotes to enclose the string and vice versa.

// want to show single quotes, then use double quotes to enclose string
var str1 = "The book 'World' is on the table."; ✅

// want to show double quotes, then use single quotes to enclose string
var str2 = 'The book "World" is on the table.'; ✅

But problem remains same if you want to display a mixture of single and double quotes within the string. Then again string will become invalid.

To solve this problem we use escape characters. Escape characters are used to escape the quotes.

javascript escape quotes

Escape characters in JavaScript

The escape character (\) in a string indicates that the character preceding it should be taken literally and not be interpreted as a special character.

The character preceding \ (quotes in this case) performs no role in the string like start and end quotes. It is printed as it is.

Look at the table below.

CodeResultDescription
'I\'m going to be a JavaScript developer.'I'm going to be a JavaScript developer.Escaped single quote (\')
"The book \"World\" is on the table."The book "World" is on the table.Escaped double quote (\")

Let's see some examples of how to use escape characters.

Example 1: Escape single quotes within the string.

Example

// 2 ways to show single quotes in string

// 01. escaping quote using backslash
var str1 = 'I\'ll be back.';
console.log(str1);

// 02. using double quotes as string encloser
var str2 = "I'll be back.";
console.log(str2);

Example 2: Escape double quotes within the string.

Example

// 2 ways to show double quotes in string

// 01. escaping quote using backslash
var str1 = "The book \"World\" is on the table.";
console.log(str1);

// 02. using single quotes as string encloser
var str2 = 'The book "World" is on the table.';
console.log(str2);

Example 3: Escape both single and double quotes within the string.

Example

// only 1 way to show both single and double quotes in string
// use escape character (\)

var str1 = "The book \"World\" is on the table. I'm going to read.";
console.log(str1);

var str2 = 'The book "World" is on the table. I\'m going to read.';
console.log(str2);

Using backticks to escape quotes

The backticks (``) are another way to enclose a string in javascript. When a string is enclosed with backticks then it can be used for multiple different purposes.

You can write JavaScript expressions within the string that actually executes, you can write multiline strings without using newline characters, and you can also write any quote (both single and double) without needing to escape it.

Let's see an example that uses backticks and needs no escape character.

Example

// using backticks to enclose string
var str = `Here is a book called "World". I'm going to read it.`;
console.log(str);

You can see above the string contains both single and double quotes but with backticks, we need not escape it.


Conclusions

The backslash is used as an escape character in JavaScript. It is used to escape the quotes within the string.

When you write a backslash in front of a quote, it is interpreted as a normal character without any special meaning. This way you can write any quote within a string without generating any error.