Cách sử dụng Biểu thức chính quy trong JavaScript

Cụm từ thông dụng, thường được gọi là “regex” hoặc “regexp”, là các chuỗi mô tả mẫu tìm kiếm. Bạn có thể sử dụng biểu thức chính quy để kiểm tra xem một chuỗi có chứa một mẫu cụ thể hay không, trích xuất thông tin từ một chuỗi và thay thế các phần của chuỗi bằng văn bản mới.

Tìm hiểu cú pháp cơ bản của biểu thức chính quy và cách sử dụng chúng trong JavaScript.

Cú pháp cơ bản của biểu thức chính quy

Có hai cách bạn có thể tạo một biểu thức chính quy trong JavaScript: sử dụng một biểu thức chính quy bằng chữ và sử dụng RegExp hàm tạo.

Một ký tự biểu thức chính quy bao gồm một mẫu được đặt giữa các dấu gạch chéo về phía trước, theo sau là một cờ tùy chọn.

Ví dụ:

 
const regexExpression_1 = /pattern/

const regexExpression_2 = /pattern/flag 

Cờ là một tham số tùy chọn mà bạn có thể thêm vào biểu thức chính quy để sửa đổi hành vi của nó. Ví dụ:

 const regexFlag = /the/g;
 

Các g cờ cho biết rằng biểu thức phải khớp với tất cả các lần xuất hiện, không chỉ lần đầu tiên.

Bạn cũng có thể tạo một biểu thức chính quy bằng cách sử dụng RegExp hàm tạo. Ví dụ:

 const regexExpression = new RegExp("Pattern", "g");
 

Các RegExp hàm tạo nhận hai tham số: một mẫu—một chuỗi hoặc một biểu thức chính quy bằng chữ—và (các) cờ.

Có hai cờ khá phổ biến mà bạn sẽ sử dụng với biểu thức chính quy trong JavaScript:

• g: Cờ chung làm cho biểu thức chính quy khớp với tất cả các lần xuất hiện của mẫu trong chuỗi đã cho thay vì một lần xuất hiện.
• tôi: Cờ không phân biệt chữ hoa chữ thường làm cho biểu thức chính quy bỏ qua chữ hoa chữ thường của mẫu và khớp các ký tự chữ hoa và chữ thường trong chuỗi đã cho.

Bạn có thể sử dụng các cờ cùng nhau trong một biểu thức theo thứ tự bất kỳ. Ví dụ:

 const regexExpression = new RegExp("Pattern", "gi");
 

Biểu thức này sẽ khớp với tất cả các lần xuất hiện của “Mẫu”, bất kể trường hợp nào.

Trong các biểu thức chính quy, một số ký tự nhất định, được gọi là siêu ký tự, có ý nghĩa đặc biệt. Bạn có thể sử dụng chúng để khớp với các loại ký tự hoặc mẫu cụ thể.

Dưới đây là một số siêu ký tự được sử dụng phổ biến nhất và ý nghĩa của chúng:

• Ký tự đại diện (.): Ký tự này khớp với bất kỳ ký tự đơn nào ngoại trừ một dòng mới. Đó là một công cụ hữu ích để khớp các mẫu có ký tự không xác định.
• Ngôi sao Kleene (*): Ký tự này khớp với 0 hoặc nhiều lần xuất hiện của ký tự hoặc nhóm trước đó. Nó cho phép ký tự hoặc nhóm trước đó xuất hiện bất kỳ số lần nào trong chuỗi, kể cả số không.
• Ký tự tùy chọn (?): Ký tự này khớp với số không hoặc một lần xuất hiện của ký tự hoặc nhóm trước đó.
• Bắt đầu neo dòng (^): Ký tự này chỉ khớp với phần đầu của một dòng hoặc chuỗi.
• Neo cuối dòng ($): Ký tự này khớp với cuối dòng hoặc chuỗi.
• Bộ ký tự/Lớp ([]): Một bộ ký tự khớp với bất kỳ ký tự nào từ một bộ ký tự trong một chuỗi. Bạn xác định chúng bằng dấu ngoặc vuông [] và bạn có thể chỉ định một bộ ký tự cố định, ký tự đặc biệt hoặc nhóm ký tự nhất định.
• Nhân vật luân phiên (|): Ký tự này khớp với ký tự hoặc nhóm trước hoặc sau. Nó hoạt động tương tự như toán tử OR JavaScript.
• Nhóm ký tự (()): Tính năng nhóm ký tự cho phép bạn nhóm các ký tự hoặc biểu thức con, áp dụng các toán tử cho chúng dưới dạng một đơn vị và kiểm soát thứ tự của các thao tác.

Kiểm tra chuỗi dựa trên biểu thức chính quy trong JavaScript

Trong JavaScript, bạn có thể kiểm tra một chuỗi dựa trên một biểu thức chính quy bằng một số phương thức.

 let regex = /.com$/;
let str = "example.com";
console.log(regex.test(str)); 
 

 let regex = /^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/;
let str = "123-456-7890";
let result = regex.exec(str);
if (result !== null) {
  console.log(`${result[0]} is a valid phone number`);
} else {
  console.log("Invalid phone number");
}
 

 let string = "The quick brown fox jumps over the lazy dog.";
let expression = /The/gi;
let newString = string.replace(expression, "a");
console.log(newString);