Strings & Template Literals
A string is text, written in single quotes ('hi'), double quotes ("hi"), or backticks (`hi`). Backticks create a template literal, which has two powerful features plain quotes don't. First, template literals can span multiple lines naturally, without special line-break characters. Second, and more commonly used, they support interpolation: ${...} inserts a variable or expression directly into the string. const msg = `Hello, ${name}!`; inserts the current value of name right into the text no clumsy string joining with + required. Strings also have useful built-in methods. "hello".toUpperCase() returns "HELLO". " hi ".trim() removes surrounding whitespace, returning "hi". "hello".length gives you the number of characters (5). "hello".includes("ell") checks whether one string contains another, returning true or false. Strings are also indexable: "hello"[0] returns "h" the first character, since indexing starts at 0, not 1.
Why this matters
- ·Template literals make building dynamic text far cleaner than joining strings with +.
- ·Built-in string methods handle common tasks (uppercase, trimming, searching) without custom code.
- ·Multi-line template literals avoid awkward manual line-break characters in strings.
Common mistakes
- ·Mixing quote types incorrectly (like starting with ' and ending with ") causes a syntax error.
- ·Forgetting the $ before {} in a template literal means the text is shown literally, not evaluated.
- ·String indexes start at 0, not 1 off-by-one mistakes are common for beginners.
Frequently asked questions
They create template literals, which support multi-line text and ${...} interpolation of variables and expressions.
Practice questions
Question 1
Create a template literal that combines a name and age variable into one sentence.
Question 2
Take a string with extra spaces and use .trim() to clean it, then display the result.
Quick check
Just for this topic answer honestly, then check yourself.
1 / 3