JavaScript Strings

Working with text data in JavaScript

📝 What are JavaScript 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 singleQuotes = 'Hello World';
let doubleQuotes = "Hello World";
let backticks = `Hello World`;

console.log(singleQuotes); // Output: Hello World
                                    

Creating Strings

''

Single Quotes

Most common way to create strings

let text = 'Hello World';
""

Double Quotes

Alternative way to create strings

let text = "Hello World";
``

Template Literals

Modern way with special features

let text = `Hello World`;
🔧

String Constructor

Creating strings with new String()

let text = new String("Hello");

🔹 String Concatenation

Combining strings together:

// Using + operator
let firstName = "John";
let lastName = "Doe";
let fullName = firstName + " " + lastName;
console.log(fullName); // Output: John Doe

// Using += operator
let greeting = "Hello";
greeting += " World";
console.log(greeting); // Output: Hello World

// Using concat() method
let str1 = "Hello";
let str2 = " World";
let result = str1.concat(str2);
console.log(result); // Output: Hello World

Output:

John Doe

Hello World

Hello World

🔹 String Properties and Methods

Strings have built-in properties and methods:

let text = "JavaScript is awesome!";

// String length
console.log(text.length); // Output: 21

// Convert to uppercase
console.log(text.toUpperCase()); // Output: JAVASCRIPT IS AWESOME!

// Convert to lowercase
console.log(text.toLowerCase()); // Output: javascript is awesome!

// Find character at position
console.log(text.charAt(0)); // Output: J
console.log(text.charAt(4)); // Output: S

// Find position of substring
console.log(text.indexOf("Script")); // Output: 4
console.log(text.indexOf("Python")); // Output: -1 (not found)

Output:

21

JAVASCRIPT IS AWESOME!

javascript is awesome!

J

S

4

-1

🔹 String Slicing and Extraction

Extract parts of strings:

let text = "Hello World";

// slice(start, end) - extracts part of string
console.log(text.slice(0, 5)); // Output: Hello
console.log(text.slice(6)); // Output: World
console.log(text.slice(-5)); // Output: World (from end)

// substring(start, end) - similar to slice
console.log(text.substring(0, 5)); // Output: Hello
console.log(text.substring(6, 11)); // Output: World

// substr(start, length) - deprecated but still used
console.log(text.substr(0, 5)); // Output: Hello
console.log(text.substr(6, 5)); // Output: World

Output:

Hello

World

World

Hello

World

Hello

World

🔹 String Search and Replace

Find and replace text in strings:

let text = "I love JavaScript. JavaScript is great!";

// Search for text
console.log(text.includes("JavaScript")); // Output: true
console.log(text.includes("Python")); // Output: false

// Check if string starts/ends with text
console.log(text.startsWith("I love")); // Output: true
console.log(text.endsWith("great!")); // Output: true

// Replace text
console.log(text.replace("JavaScript", "Python")); 
// Output: I love Python. JavaScript is great!

// Replace all occurrences
console.log(text.replaceAll("JavaScript", "Python")); 
// Output: I love Python. Python is great!

Output:

true

false

true

true

I love Python. JavaScript is great!

I love Python. Python is great!

🔹 String Splitting and Joining

Convert strings to arrays and back:

// Split string into array
let sentence = "JavaScript is awesome";
let words = sentence.split(" ");
console.log(words); // Output: ["JavaScript", "is", "awesome"]

let letters = "Hello".split("");
console.log(letters); // Output: ["H", "e", "l", "l", "o"]

// Join array into string
let fruits = ["apple", "banana", "orange"];
let fruitString = fruits.join(", ");
console.log(fruitString); // Output: apple, banana, orange

// Remove whitespace
let messyText = "  Hello World  ";
console.log(messyText.trim()); // Output: Hello World

Output:

["JavaScript", "is", "awesome"]

["H", "e", "l", "l", "o"]

apple, banana, orange

Hello World

🔹 Escape Characters

Special characters in strings:

Common Escape Characters:

  • \' - Single quote
  • \" - Double quote
  • \\ - Backslash
  • \n - New line
  • \t - Tab
// Using escape characters
let quote = "She said, \"Hello World!\"";
console.log(quote); // Output: She said, "Hello World!"

let path = "C:\\Users\\Documents\\file.txt";
console.log(path); // Output: C:\Users\Documents\file.txt

let multiLine = "Line 1\nLine 2\nLine 3";
console.log(multiLine);
// Output: 
// Line 1
// Line 2
// Line 3

🧠 Test Your Knowledge

Which method returns the length of a string?