JS Strings
Creating Strings
Strings can be created with single quotes, double quotes, or backticks, and all three behave the same for basic text, the choice is largely a matter of consistency and, for backticks, added features.
Note: Pick one quote style, single or double, for regular strings and stick with it consistently across a project for readability.
Warning: A string must start and end with the same type of quote, mismatching them causes an immediate syntax error.
Example: Creating Strings
let a = 'Single quotes';
let b = "Double quotes";
let c = `Backticks`;
console.log(a, b, c);
Template Literals
Template literals, written with backticks, let you embed variables and expressions directly inside a string using ${expression}, avoiding the need to join text together with the + operator.
Note: Template literals also support multi-line strings naturally, just press enter inside the backticks without needing a special escape character.
Warning: The ${} syntax only works inside backtick strings, using it inside single or double quotes just produces the literal characters, not an embedded value.
Example: Template Literals
const name = "Maya";
const age = 25;
console.log(`${name} is ${age} years old.`);
String Length
Every string has a length property that returns the number of characters it contains, counting letters, numbers, spaces, and punctuation all equally.
Note: length is a property, not a method, so it's accessed without parentheses, myString.length, not myString.length().
Warning: An empty string still has a length of 0, not undefined, which is worth remembering when checking whether a string has content.
Example: String Length
const message = "Hello!";
console.log(message.length);
Escape Characters
Escape characters, starting with a backslash, let you include special characters inside a string, like \n for a new line, \t for a tab, or \' to include a quote that would otherwise end the string early.
Note: Template literals with backticks avoid many escape character needs, since you can write real line breaks directly inside them.
Warning: Forgetting to escape a quote that matches the string's delimiter, like an apostrophe in dont', ends the string prematurely and causes a syntax error.
Example: Escape Characters
console.log("Line one\nLine two");
console.log("She said \"hello\"");
Comparing Strings
Strings can be compared with equality and relational operators, comparing them character by character based on their character codes, with strict equality === checking both value and type together.
Note: String comparisons are case sensitive by default, Apple and apple are not considered equal.
Warning: Comparing strings with < and > compares them alphabetically by character code, which can produce surprising results with mixed uppercase and lowercase letters.
Example: Comparing Strings
console.log("Apple" === "apple");
console.log("apple" === "apple");
console.log("apple" < "banana");
- Mixing quote styles incorrectly, like starting a string with a single quote and ending with a double quote, which causes a syntax error.
- Forgetting to escape a quote character that matches the string's own delimiter, like an apostrophe inside a single-quoted string.
- Using regular quotes when a template literal with embedded variables, backticks and ${}, would be far cleaner.
- Strings can be created with single quotes, double quotes, or backtick template literals.
- Template literals let you embed variables and expressions directly inside a string using ${}.
- The length property reports how many characters a string contains, and escape characters like \n represent special characters.
String creation, escape characters, and template literals are all standard JavaScript features supported in every current browser.
Chapter Quiz — Complete all 6 topics to unlock
0/6 topics done
Complete these topics first: