JavaScript Lesson 12: String Methods
JavaScript has powerful string methods. Many are similar to Python but with different names. Master these and text processing becomes easy.
Essential String Methods
const text = " Hello, World! ";
// Length
console.log(text.length); // 18
// Remove whitespace
console.log(text.trim()); // "Hello, World!"
console.log(text.trimStart()); // "Hello, World! "
console.log(text.trimEnd()); // " Hello, World!"
// Case
console.log(text.toUpperCase()); // " HELLO, WORLD! "
console.log(text.toLowerCase()); // " hello, world! "
// Check
console.log(text.includes("World")); // true
console.log(text.startsWith(" H")); // true
console.log(text.endsWith("! ")); // true
Searching and Replacing
const str = "I love JavaScript. JavaScript is amazing!";
console.log(str.indexOf("JavaScript")); // 7 (first)
console.log(str.lastIndexOf("JavaScript")); // 18 (last)
// Replace first occurrence
console.log(str.replace("JavaScript", "Python"));
// "I love Python. JavaScript is amazing!"
// Replace ALL occurrences
console.log(str.replaceAll("JavaScript", "Python"));
// "I love Python. Python is amazing!"
// Using regex
console.log(str.replace(/JavaScript/g, "JS"));
// "I love JS. JS is amazing!"
Splitting and Joining
const csv = "Alice,Bob,Charlie,David";
const names = csv.split(",");
console.log(names); // ["Alice","Bob","Charlie","David"]
const joined = names.join(" and ");
console.log(joined); // "Alice and Bob and Charlie and David"
// Split into characters
const chars = "hello".split("");
console.log(chars); // ["h","e","l","l","o"]
Extracting Parts
const str = "JavaScript is awesome";
console.log(str.slice(0, 10)); // "JavaScript"
console.log(str.slice(-7)); // "awesome"
console.log(str.substring(11, 13)); // "is"
console.log(str.at(0)); // "J"
console.log(str.at(-1)); // "e"
// Padding
console.log("5".padStart(3, "0")); // "005"
console.log("hi".padEnd(5, "!")); // "hi!!!"
// Repeat
console.log("ha".repeat(3)); // "hahaha"
🏋️ Practice Task
Build a slug generator. Write a function toSlug(text) that: (1) converts to lowercase, (2) trims whitespace, (3) replaces spaces with hyphens, (4) removes all non-letter/number/hyphen characters. Test: toSlug(” Hello World! 123 “) should return “hello-world-123”.
💡 Hint: Use .toLowerCase().trim().replace(/ /g, “-“).replace(/[^a-z0-9-]/g, “”) chained together.