String Fundamentals

Text is where tiny mistakes get loud: one quote mark ends your string early, one hidden conversion turns a score into "105", and one line break can make a message readable. A string is a text value, and now you'll treat it like a real value you can create, join, measure, and rebuild cleanly.

Quotes mark the edges

A string literal is a string value written directly in your code. JavaScript lets you write string literals with double quotes or single quotes:

const playerName = "Mina";
const questName = 'The Glass Gate';
const coachLine = 'Mina said, "Ready."';
const snackLine = "Today's bonus is mango.";
 
console.log(playerName);
console.log(questName);
console.log(coachLine);
console.log(snackLine);

→ Mina, The Glass Gate, Mina said, "Ready.", then Today's bonus is mango.

The quote marks are not part of the value. They're the fence around the text, telling the literal assistant where the string starts and ends.

Double quotes and single quotes create the same kind of value. The choice is style, not type. A style convention is a shared habit that keeps code easy to scan, and most teams pick one quote style per project. This course uses double quotes in everyday examples, so follow that lane unless the string itself contains double quotes and single quotes make the line clearer.

The mistake to watch for is using the same quote mark inside the string without preparing it:

const coachLine = "Mina said, "Ready."";
console.log(coachLine);

JavaScript sees the quote before Ready and thinks the string ended. The rest of the line no longer makes grammatical sense, so the parser stops with a SyntaxError.

Escape sequences: special characters inside text

An escape sequence is a backslash instruction inside a string. It lets you write characters that are hard or impossible to type directly inside quoted text.

The most useful ones are:

• \n makes a newline, a line break inside the string.
• \t makes a tab-sized gap.
• \\ makes one real backslash.
• \" puts a double quote inside a double-quoted string.
• \' puts a single quote inside a single-quoted string.

const receipt = "Receipt\nTotal: $7.49";
const playerRow = "Name:\tMina";
const saveFolder = "C:\\games\\save";
const coachLine = "Coach said, \"Reset.\"";
const turnLine = 'Mina\'s turn';
 
console.log(receipt);
console.log(playerRow);
console.log(saveFolder);
console.log(coachLine);
console.log(turnLine);

→ Receipt
Total: $7.49
Name: Mina with a tab-sized gap between the words
C:\games\save
Coach said, "Reset."
Mina's turn

Read the backslash as "treat the next thing specially." In "C:\\games\\save", each \\ becomes one real backslash in the output. In "Coach said, \"Reset.\"", the quote after the backslash is text, not the end of the string.

You don't escape every quote you see. You only escape the quote mark that would otherwise end the string. That's why this is often cleaner:

const easyLine = 'Coach said, "Reset."';
const alsoWorks = "Coach said, \"Reset.\"";
 
console.log(easyLine);
console.log(alsoWorks);

→ Coach said, "Reset.", then Coach said, "Reset.".

Both values are the same text. The first line is easier to read because the outside quotes and inside quotes are different.

Joining strings with +

Concatenation means joining strings end to end. Picture two printed strips being taped together: the second strip starts exactly where the first one ends.

JavaScript uses + for string concatenation:

const playerName = "Mina";
const score = 10;
const message = "Player " + playerName + " has " + score + " points.";
 
console.log(message);
 
const safeTotal = Number("10") + 5;
const surprisingTotal = "10" + 5;
 
console.log(safeTotal);
console.log(surprisingTotal);

→ Player Mina has 10 points., 15, then 105.

The message line is useful: JavaScript quietly turns score into text so it can join the pieces. That quiet turn is coercion, JavaScript's silent conversion behind your back.

The last line is the same rule wearing a bug costume. "10" + 5 does not do number math. It joins text, so you get "105". If the value should be a number, convert on purpose before + gets involved.

Order can matter too:

const firstTotal = 10 + 5 + " points";
const secondTotal = "points: " + 10 + 5;
 
console.log(firstTotal);
console.log(secondTotal);

→ 15 points, then points: 105.

In the first line, the number addition happens before any string appears. In the second line, the first + already starts building text, so the next + keeps building text. You don't need the full coercion map yet. Keep the beginner rule: when types matter, convert deliberately.

Try it — build a score card

Run this, then change scoreText to "20" and playerName to a longer name. Predict which lines change before you press Run.

length and the sealed-token idea

A property is a named piece of information you read with a dot. Strings have a length property:

const playerName = "Mina";
const chant = "Go, Mina!";
const emptyMessage = "";
 
console.log(playerName.length);
console.log(chant.length);
console.log(emptyMessage.length);

→ 4, 9, then 0.

For ordinary letters, digits, spaces, and punctuation, length feels like "how many characters are in this string?" Spaces and punctuation count. The empty string "" has length 0 because it contains no text at all.

Later, you'll meet emoji and other less ordinary text where length can surprise you. For now, use it confidently with ordinary text and keep the bigger character story for lesson 3.2.

Strings are still primitives, so the sealed-token model from lesson 2.2 applies. Immutable means JavaScript does not edit the string value in place. It creates a new string, and your variable label may move to that new value.

let chant = "go";
const louderChant = chant + "!";
 
console.log(chant);
console.log(louderChant);
 
chant = chant + " team";
console.log(chant);

→ go, go!, then go team.

chant + "!" did not push an exclamation point into the old "go" token. It made a new "go!" token. The final reassignment moves the chant label to another new string.

Next, you'll learn how to read pieces out of a string without pretending you can edit the sealed token itself. That is where indexing, slicing, and the first real character surprise show up.