Why backtick (``) is important in JavaScript ?

Template literals allow developers to embed expressions inside a string using placeholders, which are denoted by ${expression}. This enables developers to create dynamic strings that can be computed at runtime, and include variables, functions, and even other template literals.

const a = 'first string';

const b = 'second string';

console.log(`this is combination of ${a} and ${b}`);

output: this is combination of first string and second string

Template literals also support multi-line strings, which are defined by enclosing the string in backticks instead of quotes. This eliminates the need to use escape characters (\n) to represent line breaks, making the code more readable and easier to maintain.


console.log(`this is combination of ${a}

            and ${b} and the text you are reading is coming

            in ${c} line.`);


output: this is combination of first string

      and second string and the text you are reading is coming

      in 3 line.

Kaushik Shrimali

Laravel , Node, .NET (MVC), SQL, MySql, AWS , Serverless, Azure Portal, VCS System, Deployement

1y

Quotes should not be overlooked, as I did. let span_class = 'badge badge-info'; I/P: I missed quote <span class=${span_class}> Paid</span> O/P: <span class="badge" badge-info=""> Paid</span> I/P: After added quotes <span class='${span_class}'> Paid</span> O/P: <span class="badge badge-info"> Paid</span> 😀

Like
Reply
Joseph Wanderi

AppSec | Bug Bounty Hunter at Intigriti

1y

I came across such a scenario when hunting for a bug. The site was vulnerable to a reflected XSS, back slashes and quotation marks were all getting escape by some form of filter. As simple: ${alert(1)} was enough to break it.

Like
Reply

To view or add a comment, sign in

More articles by Rahul Gaur

Insights from the community

Others also viewed

Explore topics