JavaScript Notes
Master JavaScript string fundamentals: creation, indexing, immutability, length, escape characters, string comparison, and core concepts with visual diagrams and examples.
What is a String?
A string in JavaScript is a sequence of characters used to represent text. Characters can be letters, digits, spaces, symbols, or even emoji. Strings are one of the 8 primitive data types in JavaScript.
Think of a string like a row of lockers — each character is in its own locker with a number (index) starting from 0. You can peek into any locker, but you can't change what's inside (strings are immutable).
Creating Strings — 3 Ways
// 1. Single quotes
const city = 'Mumbai';
// 2. Double quotes
const country = "India";
// 3. Template literals (backticks) — ES6
const greeting = `Hello, World!`;
console.log(city);
console.log(country);
console.log(greeting);
console.log(typeof city);Mumbai India Hello, World! string
When to use which quotes?
| Type | When to use |
|---|---|
Single 'text' | Default for simple strings |
Double "text" | When string contains a single quote |
Backtick ` text ` | When you need interpolation or multi-line |
String Length
const course = "JavaScript Master Course";
console.log(course.length); // total characters
console.log("".length); // empty string
console.log(" ".length); // spaces count!
console.log("Hello 🌏".length); // emoji is 2 units24 0 3 8
⚠️ length is a property, not a method — no parentheses needed.Accessing Characters by Index
P n n undefined t
String Immutability
Hello Jello
Every string operation (slice, replace, toUpperCase, etc.) returns a new string — the original is never changed.
Escape Characters
// Single quote inside single-quoted string
const quote1 = 'It\'s a JavaScript tutorial';
// Double quote inside double-quoted string
const quote2 = "She said \"Hello\"";
// Newline
const multiline = "Line 1\nLine 2\nLine 3";
// Tab
const tabbed = "Name:\tJavaScript";
// Backslash
const path = "C:\\Users\\Admin\\Desktop";
console.log(quote1);
console.log(quote2);
console.log(multiline);
console.log(tabbed);
console.log(path);It's a JavaScript tutorial She said "Hello" Line 1 Line 2 Line 3 Name: JavaScript C:\Users\Admin\Desktop
Escape Sequence Reference
| Sequence | Meaning |
|---|---|
\' | Single quote |
\" | Double quote |
\\ | Backslash |
\n | New line |
\t | Tab |
\r | Carriage return |
\0 | Null character |
\uXXXX | Unicode character |
String Concatenation
// Method 1: + operator (old way)
const firstName = "Riya";
const lastName = "Sharma";
const fullName1 = firstName + " " + lastName;
// Method 2: Template literal (preferred)
const fullName2 = `${firstName} ${lastName}`;
// Method 3: concat() method
const fullName3 = firstName.concat(" ", lastName);
console.log(fullName1);
console.log(fullName2);
console.log(fullName3);Riya Sharma Riya Sharma Riya Sharma
Concatenation Gotcha — Numbers and Strings
console.log("5" + 3); // "53" — number coerced to string
console.log(5 + "3"); // "53" — number coerced to string
console.log(5 + 3 + "1"); // "81" — left to right: 8 then "81"
console.log("1" + 5 + 3); // "153" — left to right: "15" then "153"53 53 81 153
Multiline Strings
// Template literal — cleanest way
const poem = `Roses are red,
Violets are blue,
JavaScript is awesome,
And so are you!`;
console.log(poem);Roses are red, Violets are blue, JavaScript is awesome, And so are you!
String Comparison
console.log("apple" === "apple"); // true — same content
console.log("apple" === "Apple"); // false — case sensitive
console.log("a" < "b"); // true — alphabetical order
console.log("banana" > "apple"); // true — 'b' > 'a'
console.log("10" === 10); // false — different types
console.log("10" == 10); // true — loose equality (coercion)true false true true false true
Always use===(strict equality) to compare strings.==performs type coercion which leads to unexpected results.
primitive String vs String Object
// Primitive (what you always want)
const str1 = "hello";
console.log(typeof str1); // "string"
// String Object (avoid!)
const str2 = new String("hello");
console.log(typeof str2); // "object"
console.log(str1 === str2); // false — different types
console.log(str1 == str2); // true — coercion
// JavaScript auto-wraps primitive to use methods
// "hello".toUpperCase() → works because JS temporarily wraps to String objectstring object false true
Common Mistakes ❌
1. Trying to mutate a string
2. Forgetting that length is a property
// ❌ Wrong
"hello".length(); // TypeError: "hello".length is not a function
// ✅ Correct
"hello".length; // 5 — no parentheses3. Using == instead of === for comparison
// ❌ Confusing
console.log("" == false); // true (type coercion!)
console.log("0" == false); // true (type coercion!)
// ✅ Clear
console.log("" === false); // false (different types)
console.log("0" === false); // false (different types)Interview Questions 🎯
Q1. Are strings mutable in JavaScript? > No. Strings are immutable — you cannot change individual characters. All string methods return new strings; the original is never modified.
Q2. What is the difference between str[0] and str.charAt(0)? > Both return the character at index 0. str[0] returns undefined for out-of-range indices; str.charAt(0) returns an empty string "". For modern code, str[index] is preferred.
Q3. Why does "5" + 3 give "53" in JavaScript? > The + operator is overloaded. When one operand is a string, it performs concatenation instead of addition. 3 is coerced to the string "3", and concatenated with "5".
Q4. What is the difference between primitive strings and String objects? > "hello" is a primitive. new String("hello") is an object. You should almost never use new String(). Primitives automatically get String wrapper methods when you call methods on them.
Q5. How do strings compare in JavaScript? > Strings are compared lexicographically (character by character, based on Unicode code points). Use === for equality, which is case-sensitive.
Q6. What does length measure for strings? > The number of UTF-16 code units. Most characters are 1 unit; emoji and some special characters are 2 units, which can make length larger than the visual character count.
Q7. What are template literals and when should you use them? > Template literals (backticks) support string interpolation ${expr} and multi-line strings without escape sequences. Use them whenever you need to embed variables or write multi-line text.
Key Takeaways 🏁
- Strings are immutable — every transformation creates a new string
- Use backticks (template literals) for interpolation and multi-line strings
- Index starts at 0;
str[str.length - 1]gets the last character lengthis a property (no parentheses), not a method- Use strict equality
===for string comparisons — always case-sensitive "text" + numberconcatenates (not adds) — the number becomes a string- Primitive strings auto-borrow methods from
String.prototype— no need fornew String()
Exam Focus
Revise definitions, diagrams, examples, and short-answer points for JavaScript String Basics - Complete Guide to Strings with Examples.
Interview Use
Prepare one clear explanation, one practical example, and one common mistake for this JavaScript Master Course topic.
Search Terms
javascript-complete-guide, javascript master course, javascript, complete, guide, strings, string, basics
Related JavaScript Master Course Topics