`Đối tượng` RegExp`

Bài viết này giải thích về đối tượng RegExp.

Chúng tôi sẽ giải thích đối tượng RegExp với các ví dụ thực tế.

YouTube Video

Đối tượng RegExp`

RegExp là gì?

RegExp (Biểu thức chính quy) là một đối tượng dùng để biểu diễn các mẫu chuỗi. Không giống như so sánh ký tự đơn giản, bạn có thể linh hoạt định nghĩa 'các chuỗi đáp ứng những điều kiện nhất định.'.

Bằng cách sử dụng đối tượng RegExp, bạn có thể thực hiện các thao tác như tìm kiếm, kiểm tra, trích xuất và thay thế chuỗi một cách ngắn gọn và rõ ràng. Nó cực kỳ hiệu quả cho các tác vụ hàng ngày như kiểm tra dữ liệu nhập form, phân tích log và định dạng văn bản. Dưới đây là một số ví dụ đơn giản về biểu thức chính quy.

1const pattern = /abc/;

• Biểu thức chính quy này kiểm tra xem chuỗi 'abc' có tồn tại hay không.

Cách tạo biểu thức chính quy (Hai phương pháp)

Có hai kiểu cú pháp của RegExp: ký hiệu trực tiếp và khởi tạo bằng constructor.

1// Literal notation: pattern and flags are written together
2const literal         = /hello/;
3const literalWithFlag = /hello/i;
4const literalDigits   = /\d+/;
5
6// Constructor notation: pattern and flags are passed separately
7const constructor         = new RegExp("hello");
8const constructorWithFlag = new RegExp("hello", "i");
9const constructorDigits   = new RegExp("\\d+");

• Ký hiệu literal ngắn gọn và dễ đọc, phù hợp khi sử dụng biểu thức chính quy làm hằng số.. Mặt khác, ký hiệu constructor được sử dụng khi bạn muốn xây dựng mẫu bằng biến hoặc xác định nội dung của nó khi chương trình chạy.
• Với ký hiệu literal, bạn có thể mô tả trực quan cả biểu thức chính quy và các cờ của nó cùng nhau. Ngược lại, với ký hiệu constructor, bạn cần chỉ định mẫu và các cờ một cách riêng biệt.
• Ngoài ra, với ký hiệu constructor, bạn truyền biểu thức chính quy dưới dạng chuỗi, do đó các dấu gạch chéo ngược phải được escape hai lần.

test(): Kiểm tra cơ bản nhất

Đối tượng RegExp cung cấp các phương thức để đánh giá và thao tác chuỗi bằng biểu thức chính quy. test() là một phương thức trả về giá trị boolean cho biết mẫu có khớp hay không.

1const regex = /JavaScript/;
2
3console.log(regex.test("I love JavaScript")); // true
4console.log(regex.test("I love TypeScript")); // false

• Đây là phương thức đầu tiên bạn nên học, phù hợp để phân nhánh điều kiện hoặc kiểm tra hợp lệ đầu vào.

match(): Lấy kết quả khớp

match() trả về một mảng chứa chuỗi khớp và thông tin chi tiết.

1const text = "Version 1.2.3";
2const result = text.match(/\d+\.\d+\.\d+/);
3
4console.log(result[0]); // "1.2.3"

• match() thuận tiện hơn so với test() khi trích xuất và phân tích dữ liệu.

replace(): Thay thế bằng Biểu thức chính quy

replace() chuyển phần được khớp thành một chuỗi khác.

1const text = "Hello   World";
2const result = text.replace(/\s+/g, " ");
3
4console.log(result); // "Hello World"

• Bạn có thể dùng nó để định dạng log hoặc chuẩn hóa các khoảng trắng không cần thiết.

Cơ bản về Flag (g, i, m)

Bạn có thể chỉ định 'cờ' (flags) trong biểu thức chính quy. Cờ là các tùy chọn kiểm soát cách biểu thức chính quy xử lý chuỗi theo một số quy tắc nhất định. Ngay cả với cùng một mẫu, kết quả có thể thay đổi tùy thuộc vào cờ được sử dụng.

1const text = "apple Apple APPLE";
2const regex = /apple/gi;        // or new RegExp("apple", "gi");
3
4console.log(text.match(regex)); // ["apple", "Apple", "APPLE"]

• Cờ g (global) tìm kiếm trên toàn bộ chuỗi.
• Cờ i (ignore case) bỏ qua sự khác biệt về chữ hoa và chữ thường khi so khớp.

1const multilineText = `apple
2banana
3apple`;
4
5const regexM = /^apple/gm;
6
7console.log(multilineText.match(regexM)); // ["apple", "apple"]

• Cờ m (multiline) được dùng để xử lý chuỗi nhiều dòng theo từng dòng riêng biệt. Nhờ đó, ^ và $ sẽ hoạt động dựa trên điểm đầu hoặc cuối của mỗi dòng thay vì toàn bộ chuỗi.

Lớp ký tự: Kết hợp nhiều lựa chọn

Bằng cách dùng dấu ngoặc vuông [], bạn có thể định nghĩa tập hợp các ký tự có thể tại một vị trí.

1const regex = /gr[ae]y/;
2
3console.log(regex.test("gray")); // true
4console.log(regex.test("grey")); // true

• Điều này hữu ích để xử lý các biến thể chính tả hoặc các lựa chọn thay thế đơn giản.

Ký tự đặc biệt: Phím tắt phổ biến

Ký tự đặc biệt là các ký hiệu cho phép bạn viết các mẫu thường dùng dưới dạng ngắn hơn.

1const regex = /\d{4}-\d{2}-\d{2}/;  // or new RegExp("\\d{4}-\\d{2}-\\d{2}");
2
3console.log(regex.test("2025-12-29")); // true

• \d có nghĩa là một chữ số, còn {n} chỉ định số lần lặp lại.

^ và $: Kiểm tra toàn bộ chuỗi

^ và $ đại diện cho điểm bắt đầu và kết thúc của chuỗi.

1const regex = /^\d+$/;
2
3console.log(regex.test("123"));   // true
4console.log(regex.test("123a"));  // false

• Chúng rất quan trọng trong các trường hợp cần khớp chính xác, ví dụ kiểm tra đầu vào của biểu mẫu.

Nhóm và bắt dữ liệu (Grouping and Capturing)

Bằng cách sử dụng dấu ngoặc đơn (), bạn có thể trích xuất các giá trị con.

1const text = "2025/12/29";
2const regex = /(\d{4})\/(\d{2})\/(\d{2})/;
3const [, year, month, day] = text.match(regex);
4
5console.log(year, month, day); // 2025 12 29

• Nó thường xuyên được dùng để tách ngày tháng hoặc chuỗi có cấu trúc.

Những lỗi thường gặp và lưu ý quan trọng

Biểu thức chính quy rất mạnh nhưng thường khó đọc.

1// Hard to read
2const regex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+$/;

• Nếu trở nên quá phức tạp, bạn có thể cân nhắc thêm chú thích, chia nhỏ biểu thức hoặc chỉnh sửa lại toàn bộ quy trình.

Tóm tắt

RegExp là một tính năng nền tảng quan trọng trong JavaScript giúp mô tả xử lý chuỗi một cách đơn giản và chính xác. Bạn không cần học các biểu thức chính quy phức tạp ngay từ đầu; điều quan trọng là sử dụng các phương thức và cú pháp cơ bản như test, match và replace phù hợp với nhu cầu thực tế của bạn. Nếu bạn coi biểu thức chính quy không phải là 'kiến thức đặc biệt' mà là 'công cụ biểu diễn mẫu một cách có tổ chức', bạn sẽ nâng cao chất lượng và khả năng đọc hiểu khi kiểm tra đầu vào cũng như xử lý văn bản.

Bạn có thể làm theo bài viết trên bằng cách sử dụng Visual Studio Code trên kênh YouTube của chúng tôi. Vui lòng ghé thăm kênh YouTube.

YouTube Video