JavaScript Lesson 12: String Methods

⚡ JavaScript CourseLesson 12 of 20 · 60% complete

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.

Similar Posts

Leave a Reply

Your email address will not be published. Required fields are marked *