![What is template literals in javascript](/static/a1927cbe6b6da1534821cdb877e435e6/86f4e/templateliterals.png)
๐What is Template Literals ?
Template literals are string literals allowing embedded expressions. You can use multi-line strings and string interpolation features with them.
![Template literals key](/static/08372db99dd3b37f8228957783d32280/9732a/0.png)
๐Template Literals
use back-ticks (``)
rather than the quotes ("") to define a string
jslet text = `Learn javascript`;console.log(text); // Learn javascript
![template literals](/static/fe52a0f59ecdccb6cc19c8f70663cf7c/5f8aa/1.png)
๐Quotes Inside
Strings With template literals, you can use both single and double quotes inside a string:
jslet whoiam = `Hello i'm "sumit"`;console.log(whoiam); // Hello i'm "sumit"
![string with template literals](/static/e440f8fb7532eefccfb2ecf7f494ee51/fd792/2.png)
๐Multiline Strings
Template literals allows multiline strings
jslet multiline = `this is line 1this is line 2this is line 3`;console.log(multiline);
![Multiline Strings](/static/b1b9a83879eb02045ef11fd90ce801ce/7c3a4/3.png)
๐Variable substitutions
Template literals allows variables in strings
jslet fname = "sumit";let lname = "harijan";let fullname = `my name is ${fname} ${lname}`;console.log(fullname); // my name is sumit harijan
![Variable substitutions](/static/44d54196c4c1d00a94f57da787ae207d/00cab/4.png)
๐Expression substitutions
Template literals allows expressions in strings
jslet a = 5,b = 6;console.log(`sum of 5+6 is ${a + b}not ${a + b + 2}`);<GatsbyImageimage={getImage(props.multipleImages[5])}alt="Expression substitutions"className="first-inline-img"/>;