How to Escape Quotes in a String in JavaScript

When working with strings in any programming language, you will sometimes need to use quote characters inside of a string.

To do this properly, you need to escape the quote characters so that the string is properly terminated.

If you don't, the string will get prematurely terminated and the rest of the string will be interpreted as code, producing unexpected results.

In this post, we'll learn all the different ways to escape quotes in JavaScript.

How to escape quotes by using backslashes

The easiest way to escape a quote in JavaScript is to use the backslash character \ before the quote character.

Let's look at an escaped single quote:

JAVASCRIPT
const escapedSingleQuote = 'I\'m a string';

console.log(escapedSingleQuote);

BASH
I'm a string

When you put a backslash \ before a quote character, it tells the JavaScript interpreter to ignore the quote character and treat it as a regular character.

This works the same way when working with double quotes:

JAVASCRIPT
const escapedDoubleQuote = "She didn't want to call him \"Mr. Smith\"";

console.log(escapedDoubleQuote);

BASH
She didn't want to call him "Mr. Smith"

Notice how since there were two quote characters in the string, we had to escape both of them.

Escaping quotes by changing the outer quote character

Another way to escape quotes is to change the outer quote character.

Simply use the opposite quote character to escape the quote character you want to use.

Here's an example of using single quotes to escape double quotes:

JAVASCRIPT
const escapedDoubleQuote = 'She did not want to call him "Mr. Smith"';

console.log(escapedDoubleQuote);

BASH
She did not want to call him "Mr. Smith"

Notice how no backslashes were used in this example because we used single quotes to escape the double quotes.

This also works in reverse:

JAVASCRIPT
const escapedSingleQuote = "She did not want to call him 'Mr. Smith'";

console.log(escapedSingleQuote);

BASH
She did not want to call him 'Mr. Smith'

Escaping quotes by using template literals

Template literals are a new feature in JavaScript that allow you to use strings with embedded expressions.

They are defined using backticks (`) instead of single or double quotes.

When using template literals, you can use single or double quotes without having to escape them:

JAVASCRIPT
const escapedSingleQuote = `She did not want to call him 'Mr. Smith'`;
const escapedDoubleQuote = `She did not want to call him "Mr. Smith"`;

console.log(escapedSingleQuote);
console.log(escapedDoubleQuote);

BASH
She did not want to call him 'Mr. Smith'
She did not want to call him "Mr. Smith"

As you can see, there are plenty of ways to escape quotes in JavaScript.

Conclusion

In this post, we learned how to escape quotes in JavaScript.

Your options include using backslashes, changing the outer quote character, or using template literals.

Thanks for reading!

• Support Us
• Discord
• Share
• Post
• Share