Code / JavaScript from Zero / Unit 2: Strings and decisions

Working with text टेक्स्ट के साथ काम

Lesson 3 of 15 · about 12 minutes · Template literals, string methods and a GST bill line.

⚡ 0 XP

Step 1 of 2

Template literals

Joining text with + gets messy. A template literal is text written between backticks (the key to the left of 1 on most keyboards) instead of quotes. Inside it, values go in ${ }:

${name} is replaced by the value of name
You can even do maths inside: ${price * qty}

See the example below. Strings also have handy tools (methods):

"chai".length is 4
"pune".toUpperCase() is "PUNE"
" hi ".trim() removes the spaces at both ends

Example

const name = "Meera";
const marks = 92;
console.log(`${name} scored ${marks} marks`);
console.log(name.toUpperCase(), name.length);

Prints: Meera scored 92 marks, then MEERA 5

🎯 Challenge: A message with backticks +15 XP

Using a template literal, make message equal to Ravi studies in class 9 at KV Pune (use the three variables, don’t type the values again). Then make shout the school name in CAPITAL letters. Print message.

Try twice to unlock the solution (0/2)

script.jsCtrl ⏎

Console

Output from console.log appears here.

Checklist

Press Run to check your code.

message is “Ravi studies in class 9 at KV Pune”
A template literal with ${ } is used
shout is “KV PUNE”
message is printed

Lesson notes (text version)

1. Template literals

Joining text with + gets messy. A template literal is text written between backticks (the key to the left of 1 on most keyboards) instead of quotes. Inside it, values go in ${ }:

${name} is replaced by the value of name
You can even do maths inside: ${price * qty}

See the example below. Strings also have handy tools (methods):

"chai".length is 4
"pune".toUpperCase() is "PUNE"
" hi ".trim() removes the spaces at both ends

                const name = "Meera";
const marks = 92;
console.log(`${name} scored ${marks} marks`);
console.log(name.toUpperCase(), name.length);

Challenge: A message with backticks

2. A GST bill line

Bills show money with exactly two decimal places: ₹236.00, not ₹236. The method toFixed(2) does that — it turns a number into text with 2 digits after the point:

(236).toFixed(2) → "236.00"
(59.5).toFixed(2) → "59.50"

GST is a percentage of the price. With 18% GST on ₹200: GST = 200 * 18 / 100 = ₹36, total = ₹236.

                const chai = 15;
const cups = 3;
console.log(`Chai x${cups} = ₹${(chai * cups).toFixed(2)}`);

Challenge: Masala Dosa with GST

Two Masala Dosas at ₹100 each, and (for this example) GST is 18%. Work out total = price × qty plus 18% GST. Then build line exactly like Masala Dosa x2 = ₹236.00 using a template literal and toFixed(2), and print it.