JavaScript Strings
Working with text data in JavaScript
📝 What are Strings?
Strings are sequences of characters used to represent text. In JavaScript, strings can be created using single quotes, double quotes, or backticks.
// Different ways to create strings
let singleQuote = 'Hello World';
let doubleQuote = "Hello World";
let backtick = `Hello World`;
console.log(singleQuote, doubleQuote, backtick);
Output:
Hello World Hello World Hello World
String Features
Length
Get the number of characters
let text = "Hello";
console.log(text.length); // 5Access Characters
Get individual characters by index
let text = "Hello";
console.log(text[0]); // "H"
console.log(text.charAt(1)); // "e"Concatenation
Join strings together
let first = "Hello";
let second = "World";
let result = first + " " + second;Template Literals
Embed expressions in strings
let name = "John";
let greeting = `Hello, ${name}!`;🔹 Creating Strings
There are multiple ways to create strings in JavaScript:
// Using string literals
let str1 = "Hello World"; // Double quotes
let str2 = 'Hello World'; // Single quotes
let str3 = `Hello World`; // Template literals
// Using String constructor
let str4 = new String("Hello World");
// Strings with quotes inside
let str5 = "She said 'Hello'";
let str6 = 'He said "Hello"';
let str7 = `Both "quotes" and 'apostrophes'`;
console.log(str1, str2, str3, str4, str5, str6, str7);Output:
Hello World Hello World Hello World Hello World She said 'Hello' He said "Hello" Both "quotes" and 'apostrophes'
🔹 String Length and Access
Working with string length and accessing characters:
let text = "JavaScript";
// Get string length
console.log("Length:", text.length); // 10
// Access characters by index
console.log("First character:", text[0]); // "J"
console.log("Last character:", text[text.length - 1]); // "t"
// Using charAt() method
console.log("Character at index 4:", text.charAt(4)); // "S"
// Check if index exists
console.log("Character at index 20:", text[20]); // undefinedOutput:
Length: 10
First character: J
Last character: t
Character at index 4: S
Character at index 20: undefined
🔹 String Concatenation
Different ways to join strings together:
let firstName = "John";
let lastName = "Doe";
// Using + operator
let fullName1 = firstName + " " + lastName;
// Using += operator
let fullName2 = firstName;
fullName2 += " " + lastName;
// Using concat() method
let fullName3 = firstName.concat(" ", lastName);
// Using template literals (recommended)
let fullName4 = `${firstName} ${lastName}`;
console.log(fullName1);
console.log(fullName2);
console.log(fullName3);
console.log(fullName4);Output:
John Doe
John Doe
John Doe
John Doe
🔹 Template Literals
Template literals provide powerful string formatting capabilities:
let name = "Alice";
let age = 25;
let city = "New York";
// Multi-line strings
let multiLine = `Hello,
this is a multi-line
string in JavaScript!`;
// Expression embedding
let greeting = `Hello, my name is ${name}`;
let info = `I am ${age} years old and live in ${city}`;
// Expressions and calculations
let math = `2 + 3 = ${2 + 3}`;
let conditional = `You are ${age >= 18 ? 'an adult' : 'a minor'}`;
console.log(multiLine);
console.log(greeting);
console.log(info);
console.log(math);
console.log(conditional);Output:
Hello,
this is a multi-line
string in JavaScript!
Hello, my name is Alice
I am 25 years old and live in New York
2 + 3 = 5
You are an adult
🔹 Escape Characters
Special characters that need to be escaped in strings:
// Common escape sequences
let newLine = "First line\nSecond line";
let tab = "Column1\tColumn2";
let quote = "She said \"Hello\"";
let apostrophe = 'It\'s a beautiful day';
let backslash = "This is a backslash: \\";
// Unicode characters
let heart = "\u2764"; // ❤
let smiley = "\u263A"; // ☺
console.log(newLine);
console.log(tab);
console.log(quote);
console.log(apostrophe);
console.log(backslash);
console.log("Heart:", heart);
console.log("Smiley:", smiley);Output:
First line
Second line
Column1 Column2
She said "Hello"
It's a beautiful day
This is a backslash: \
Heart: ❤
Smiley: ☺