Character Classes

Character Classes in JavaScript

In JavaScript, character classes are used in regular expressions (regex) to match a specific set or range of characters in a string. They provide a way to define a set of acceptable characters, allowing you to create patterns that match various combinations of characters in strings.

1️⃣ What Are Character Classes?

A character class is a set of characters enclosed within square brackets ([]). The characters within the brackets define a group of characters that can be matched in a regular expression.

For example, the regular expression [abc] matches any of the characters a, b, or c.

2️⃣ Common Character Classes

Here are some of the most commonly used character classes in JavaScript:

2.1 Basic Character Classes

[abc]: Matches any single character a, b, or c.
- Example: /[abc]/ matches a, b, or c in a string.
[^abc]: Matches any single character except a, b, or c (negation).
- Example: /[^abc]/ matches any character other than a, b, or c.
[a-z]: Matches any lowercase letter from a to z.
- Example: /[a-z]/ matches any lowercase letter in the string.
[A-Z]: Matches any uppercase letter from A to Z.
- Example: /[A-Z]/ matches any uppercase letter in the string.
[0-9]: Matches any digit from 0 to 9.
- Example: /[0-9]/ matches any digit in the string.
[a-zA-Z]: Matches any letter, either lowercase or uppercase.
- Example: /[a-zA-Z]/ matches any letter (case-insensitive).

2.2 Predefined Character Classes

JavaScript regular expressions provide a set of predefined character classes that allow you to match common groups of characters.

\d: Matches any digit, equivalent to [0-9].
- Example: /\d/ matches any digit (0-9).
\D: Matches any non-digit, equivalent to [^0-9].
- Example: /\D/ matches any character except a digit.
\w: Matches any word character (alphanumeric character plus underscore), equivalent to [a-zA-Z0-9_].
- Example: /\w/ matches any letter, digit, or underscore.
\W: Matches any non-word character, equivalent to [^a-zA-Z0-9_].
- Example: /\W/ matches any character that is not a letter, digit, or underscore.
\s: Matches any whitespace character (spaces, tabs, newlines, etc.).
- Example: /\s/ matches any whitespace character.
\S: Matches any non-whitespace character.
- Example: /\S/ matches any character that is not a space, tab, or newline.

3️⃣ Ranges and Unicode in Character Classes

3.1 Ranges

Character classes can also define ranges of characters to match a sequence of characters. For example:

[a-z]: Matches any lowercase letter from a to z.
[A-Z]: Matches any uppercase letter from A to Z.
[0-9]: Matches any digit from 0 to 9.

You can combine multiple ranges in a single character class:

/[a-zA-Z0-9]/  // Matches any letter (lowercase or uppercase) or digit.

3.2 Unicode Ranges

JavaScript supports Unicode in regular expressions, allowing you to define character ranges beyond basic ASCII. For example:

\p{Letter}: Matches any character categorized as a letter (this is part of Unicode property escapes introduced in ECMAScript 2018).

Example:

const regex = /\p{Letter}/u;  // Matches any letter (including non-ASCII letters).
console.log(regex.test("é"));  // true

Note: For Unicode property escapes like \p{Letter}, you must use the u flag (/u), which enables Unicode support in regular expressions.

4️⃣ Example Usage of Character Classes in JavaScript

4.1 Match any digit in a string

const regex = /\d/;
const str = "Hello 2025";
console.log(regex.test(str));  // true (because "2" is a digit)

4.2 Match any word character (letters, digits, or underscore)

const regex = /\w+/;  // Match one or more word characters
const str = "Hello_123";
console.log(str.match(regex));  // ["Hello_123"]

4.3 Match any non-digit character

const regex = /\D/;  // Match any character that is not a digit
const str = "abc123";
console.log(str.match(regex));  // ["a"]

4.4 Match any whitespace character

const regex = /\s/;  // Match a whitespace character (space, tab, newline)
const str = "Hello World";
console.log(regex.test(str));  // true (because there is a space between "Hello" and "World")

4.5 Match any uppercase letter

const regex = /[A-Z]/;
const str = "Hello World!";
console.log(regex.test(str));  // true (because "H" is an uppercase letter)

5️⃣ Combining Character Classes

You can combine multiple character classes within a regular expression:

5.1 Match a string with a mix of letters, digits, and underscores

const regex = /\w+/;  // Match one or more word characters (letters, digits, or underscores)
const str = "hello_world_123";
console.log(regex.test(str));  // true

5.2 Match a string containing only lowercase letters and digits

const regex = /^[a-z0-9]+$/;  // Match strings that only contain lowercase letters or digits
const str = "hello123";
console.log(regex.test(str));  // true

5.3 Match a valid email address (simplified example)

const regex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
const email = "test@example.com";
console.log(regex.test(email));  // true

6️⃣ Conclusion

Character classes in JavaScript regular expressions provide a powerful way to match specific sets or ranges of characters. You can match digits, letters, word characters, whitespaces, and even use more advanced patterns with Unicode properties.

Here are the key points:

[abc]: Matches any of the characters a, b, or c.
\d: Matches any digit (equivalent to [0-9]).
\w: Matches any alphanumeric character or underscore.
\s: Matches any whitespace character.
Ranges: Use - to define ranges, like [a-z], [0-9], etc.
Unicode: With \p{...} and the u flag, you can match Unicode characters.

Character classes give you flexibility in building regex patterns for string validation, text parsing, and searching. Let me know if you have more specific use cases or questions! 😊

Souy Soeng

Character Classes