JavaScript Regex Playground

JavaScript Regex Playground – Yellow & Teal

🔍 Understanding Regular Expressions in JavaScript

📘 Understanding JavaScript Regular Expressions

In JavaScript, a regular expression (or RegExp) is a pattern used to match character combinations in strings. You define them using a special syntax that starts and ends with forward slashes: /pattern/flags.

🔹 Format

/your-pattern/flags

For example:

/hello/i

This will match "hello", "Hello", "HELLO", etc., because of the i flag (case-insensitive).

🔹 Common Regex Symbols

  • . – Matches any single character except newline
  • \d – Matches any digit (0–9)
  • \w – Matches any word character (letters, digits, underscore)
  • \s – Matches any whitespace character (space, tab, etc.)
  • + – Matches one or more of the preceding token
  • * – Matches zero or more of the preceding token
  • ? – Matches zero or one of the preceding token
  • ^ – Matches the start of a line or string
  • $ – Matches the end of a line or string
  • [] – Matches any one character inside the brackets
  • (...) – Groups expressions
  • | – Acts like OR between patterns
  • \ – Escapes special characters (like \. to match a literal dot)

🔹 Flags (Modifiers)

  • g – Global match (find all matches, not just the first)
  • i – Case-insensitive match
  • m – Multi-line match (affects ^ and $)

🔹 Examples with Explanation

  • /\d+/g – Matches one or more digits globally (all numbers)
  • /\b\w{4}\b/g – Finds all words with exactly 4 letters
  • /\$\d+/g – Matches price formats like "$100"
  • /^\d{4}-\d{2}-\d{2}$/ – Matches full date like "2025-12-31"
  • /[A-Z]{2,}/g – Matches uppercase words with 2 or more letters

Note: Always include the slashes / and optional flags like g, i when using the interactive playground.

Wrong: \d+
Correct: /\d+/g

🧪 Try It Yourself

Type a sample text and try expressions like:

  • /\d{3}-\d{3}-\d{4}/ – Matches phone numbers
  • /[a-z]+@[a-z]+\.(com|in)/i – Matches basic email format

Regular expressions (regex) are patterns used to match character combinations in strings. JavaScript supports regular expressions through its built-in RegExp object and string methods like match(), replace(), and test().

🎯 Basic Syntax


// Create regex
let pattern = /hello/;
let result = pattern.test("hello world");  // true
  

Or using constructor:


let pattern = new RegExp("hello", "i"); // case-insensitive
let result = pattern.test("Hello world"); // true
  

🧪 Common Regex Patterns

  • \d: Any digit
  • \w: Word character (letters, digits, underscore)
  • \s: Whitespace
  • .: Any character except newline
  • *: Zero or more times
  • +: One or more times
  • [abc]: Match 'a' or 'b' or 'c'
  • ^: Start of string
  • $: End of string

🧑‍💻 Try It Yourself – Regex Playground



📌 Example Usage


let str = "The price is ₹100";
let pattern = /\₹\d+/;
let result = str.match(pattern);
console.log(result); // ["₹100"]
    

💡 Summary

  • Use /pattern/flags format.
  • Use test() to check presence, match() to extract matches.
  • Flags like g, i, m change how matches behave.

Created with ❤️ by Champak Roy

Post a Comment

0 Comments

Me