JavaScript Regex: Hiểu Quyền Lực Của Tìm Kiếm Văn Bản

Trong JavaScript, Biểu thức Chính quy (RegEx) là một đối tượng mô tả một chuỗi ký tự được sử dụng để định nghĩa một mẫu tìm kiếm. Ví dụ,

/^a…s$/

Mã trên định nghĩa một mẫu RegEx. Mẫu này là: bất kỳ chuỗi gồm năm ký tự bắt đầu bằng a và kết thúc bằng s.

Một mẫu được định nghĩa bằng RegEx có thể được sử dụng để so khớp với một chuỗi.

Biểu thức	Chuỗi	So khớp?
/^a...s$/	abs	Không so khớp
alias	So khớp
abyss	So khớp
Alias	Không so khớp
An abacus	Không so khớp

---

Tạo Một RegEx

Có hai cách bạn có thể tạo một biểu thức chính quy trong JavaScript.

. Sử dụng biểu thức chính quy trực tiếp:
Biểu thức chính quy bao gồm một mẫu được bao quanh bởi dấu gạch chéo /. Ví dụ, Ở đây, /abc/ là một biểu thức chính quy.

cost regularExp = /abc/;

. Sử dụng hàm tạo RegExp() **:
Bạn cũng có thể tạo một biểu thức chính quy bằng cách gọi hàm tạo RegExp(). Ví dụ,

const reguarExp = new RegExp('abc');

Ví dụ,

const regex = new RegExp(/^a...s$/);
console.log(regex.test('alias')); // true

Run Code

Trong ví dụ trên, chuỗi alias khớp với mẫu RegEx /^a...s$/. Ở đây, phương thức test() được sử dụng để kiểm tra xem chuỗi có khớp với mẫu không.

Còn rất nhiều phương thức khác có sẵn để sử dụng với JavaScript RegEx. Trước khi khám phá chúng, hãy tìm hiểu về chính quy chính thức.

---

Xác định Mẫu Bằng RegEx

Để xác định biểu thức chính quy, các ký tự đặc biệt được sử dụng. Trong ví dụ trên (/^a...s$/), ^ và $ là các ký tự đặc biệt.

---

Các Ký Tự Đặc Biệt

Các ký tự đặc biệt là các ký tự được hiểu theo một cách đặc biệt bởi một máy chạy Biểu thức chính quy (RegEx). Dưới đây là danh sách các ký tự đặc biệt:

[] . ^ $ * + ? {} () \ |

---

**[]** – Dấu ngoặc vuông

Dấu ngoặc vuông xác định một tập hợp các ký tự bạn muốn khớp.

Biểu thức	Chuỗi	Khớp?
[abc]	a	1 khớp
ac	2 khớp
Hey Jude	Không khớp
abc de ca	5 khớp

Ở đây, [abc] sẽ khớp nếu chuỗi bạn đang cố khớp chứa bất kỳ a, b hoặc c nào.

Bạn cũng có thể xác định một phạm vi ký tự bằng cách sử dụng dấu - bên trong dấu ngoặc vuông.

[a-e] tương đương với [abcde].

[1-4] tương đương với [1234].

[0-39] tương đương với [01239].

Bạn có thể phủ định (đảo ngược) tập hợp ký tự bằng cách sử dụng dấu mũ ^ ở đầu của dấu ngoặc vuông.

[^abc] có nghĩa là bất kỳ ký tự nào ngoại trừ a hoặc b hoặc c.

[^0-9] có nghĩa là bất kỳ ký tự không phải là số.

---

. – Dấu chấm

Dấu chấm khớp với bất kỳ ký tự đơn nào (ngoại trừ ký tự xuống dòng '\n').

Biểu thức	Chuỗi	Khớp?
..	a	Không khớp
ac	1 khớp
acd	1 khớp
acde	2 khớp (chứa 4 ký tự)

---

**^** – Dấu mũ

Ký tự mũ ^ được sử dụng để kiểm tra xem một chuỗi bắt đầu bằng một ký tự cụ thể.

Biểu thức	Chuỗi	Khớp?
^a	a	1 khớp
abc	1 khớp
bac	Không khớp
^ab	abc	1 khớp
acb	Không khớp (bắt đầu bằng a nhưng không theo sau bởi b)

---

**$** – Đô la

Ký tự đô la $ được sử dụng để kiểm tra xem một chuỗi kết thúc bằng một ký tự cụ thể.

Biểu thức	Chuỗi	Khớp?
a$	a	1 khớp
formula	1 khớp
cab	Không khớp

---

**\*** – Sao

Ký tự sao * khớp với không hoặc nhiều lần xuất hiện của mẫu bên trái nó.

Biểu thức	Chuỗi	Khớp?
ma*n	mn	1 khớp
man	1 khớp
mann	1 khớp
main	Không khớp (a không theo sau bởi n)
woman	1 khớp

---

**+** – Cộng

Ký tự cộng + khớp với một hoặc nhiều lần xuất hiện của mẫu bên trái nó.

Biểu thức	Chuỗi	Khớp?
ma+n	mn	Không khớp (không có ký tự a)
man	1 khớp
mann	1 khớp
main	Không khớp (a không theo sau bởi n)
woman	1 khớp

---

**?** – Dấu hỏi

Ký tự dấu hỏi ? khớp với không hoặc một lần xuất hiện của mẫu bên trái nó.

Biểu thức	Chuỗi	Khớp?
ma?n	mn	1 khớp
man	1 khớp
maan	Không khớp (nhiều hơn một ký tự a)
main	Không khớp (a không theo sau bởi n)
woman	1 khớp
Xin cảm ơn!
* * *

**{}** – Dấu ngoặc nhọn

Xem xét đoạn mã này: {n,m}. Điều này có nghĩa là ít nhất n, và tối đa m lần lặp lại của mẫu bên trái nó.

Biểu thức	Chuỗi	Khớp?
a{2,3}	abc dat	Không khớp
abc daat	1 khớp (tại daat)
aabc daaat	2 khớp (tại aabc và daaat)
aabc daaaat	2 khớp (tại aabc và daaaat)

Hãy xem thêm một ví dụ nữa. Biểu thức chính quy này [0-9]{2,4} khớp ít nhất 2 chữ số nhưng không quá 4 chữ số.

Biểu thức	Chuỗi	Khớp?
[0-9]{2,4}	ab123csde	1 khớp (khớp tại ab123csde)
12 and 345673	3 khớp (12, 3456, 73)
1 and 2	Không khớp

---

**|** – Lựa chọn

Dấu thẳng đứng | được sử dụng cho lựa chọn (toán tử hoặc).

Biểu thức	Chuỗi	Khớp?
a|b	cde	Không khớp
ade	1 khớp (khớp tại ade)
acdbea	3 khớp (tại acdbea)

Ở đây, a|b khớp với bất kỳ chuỗi nào chứa cả a hoặc b

---

**()** – Nhóm

Dấu ngoặc đơn () được sử dụng để nhóm các mẫu con. Ví dụ, (a|b|c)xz khớp với bất kỳ chuỗi nào khớp với a hoặc b hoặc c theo sau bởi xz

Biểu thức	Chuỗi	Khớp?
(a|b|c)xz	ab xz	Không khớp
abxz	1 khớp (khớp tại abxz)
axz cabxz	2 khớp (tại axz và cabxz)

---

**\** – Gạch chéo ngược

Gạch chéo ngược \ được sử dụng để bỏ qua các ký tự khác nhau, bao gồm tất cả các ký tự đặc biệt. Ví dụ,

\$a khớp nếu chuỗi chứa $ theo sau bởi a. Ở đây, $ không được giải thích theo cách đặc biệt bởi bộ máy chính quy.

Nếu bạn không chắc chắn liệu một ký tự có ý nghĩa đặc biệt hay không, bạn có thể đặt \ phía trước nó. Điều này đảm bảo rằng ký tự đó không được xử lý theo cách đặc biệt.

---

Các Trình Tự Đặc Biệt

Các trình tự đặc biệt giúp việc viết các mẫu thông thường dễ dàng hơn. Dưới đây là danh sách các trình tự đặc biệt:

\A – Khớp nếu các ký tự cụ thể ở đầu chuỗi.

Biểu thức	Chuỗi	Khớp?
\Athe	mặt trời	Khớp
Trong mặt trời	Không khớp

---

\b – Khớp nếu các ký tự cụ thể ở đầu hoặc cuối của một từ.

Biểu thức	Chuỗi	Khớp?
\bfoo	bóng đá	Khớp
bóng đá một bàn	Khớp
foo\b	bóng đá một bàn	Không khớp
món bò	Khớp
món afoo thử	Khớp
món afootest	Không khớp

---

\B – Đối lập của \b. Khớp nếu các ký tự cụ thể không ở đầu hoặc cuối của một từ.

Biểu thức	Chuỗi	Khớp?
\Bfoo	bóng đá	Không khớp
bóng đá một bàn	Không khớp
foo\B	bóng đá một bàn	Khớp
món bò	Không khớp
món afoo thử	Không khớp
món afootest	Khớp

---

\d – Khớp với bất kỳ chữ số thập phân nào. Tương đương với [0-9]

Biểu thức	Chuỗi	Khớp?
\d	12abc3	3 khớp (tại 12abc3)
JavaScript	Không khớp

---

\D – Khớp với bất kỳ chữ số không phải thập phân nào. Tương đương với [^0-9]

Biểu thức	Chuỗi	Khớp?
\D	1ab34"50	3 khớp (tại 1ab34"50)
1345	Không khớp

---

\s – Khớp nếu một chuỗi chứa bất kỳ ký tự khoảng trắng nào. Tương đương với [ \t\n\r\f\v].

Biểu thức	Chuỗi	Khớp?
\s	JavaScript RegEx	1 khớp
JavaScriptRegEx	Không khớp

---

\S – Khớp nếu một chuỗi chứa bất kỳ ký tự không phải khoảng trắng nào. Tương đương với [^ \t\n\r\f\v].

Biểu thức	Chuỗi	Khớp?
\S	a b	2 khớp (tại a và b)
	Không khớp

---

\w – Khớp với bất kỳ ký tự chữ số và chữ cái nào (chữ số và bảng chữ cái). Tương đương với [a-zA-Z0-9_]. Lưu ý rằng gạch dưới _ cũng được coi là một ký tự chữ số và chữ cái.

Biểu thức	Chuỗi	Khớp?
\w	12&": ;c	3 khớp (tại 12&": ;c)
%"> !	Không khớp

---

\W – Khớp với bất kỳ ký tự không phải là chữ số và chữ cái nào. Tương đương với [^a-zA-Z0-9_]

Biểu thức	Chuỗi	Khớp?
\W	1a2%c	1 khớp (tại 1a2%c)
JavaScript	Không khớp

---

\Z – Khớp nếu các ký tự cụ thể ở cuối chuỗi.

Biểu thức	Chuỗi	Khớp?
JavaScript\Z	Tôi thích JavaScript	1 khớp
Tôi thích Lập trình JavaScript	Không khớp
JavaScript thú vị	Không khớp

Mẹo: Để xây dựng và kiểm tra các biểu thức chính quy, bạn có thể sử dụng các công cụ kiểm tra chính quy như regex101. Công cụ này không chỉ giúp bạn tạo ra các biểu thức chính quy mà còn giúp bạn học cách sử dụng chúng.

Bây giờ bạn đã hiểu về cơ bản về biểu thức chính quy, hãy thảo luận về cách sử dụng chúng trong mã JavaScript của bạn.

---

Các Phương Thức Biểu Thức Chính Quy JavaScript

Như đã đề cập ở trên, bạn có thể sử dụng RegExp() hoặc biểu thức chính quy một cách định dạng để tạo biểu thức chính quy trong JavaScript.

const regex1 = /^ab/;
const regex2 = new Regexp('/^ab/');

Trong JavaScript, bạn có thể sử dụng biểu thức chính quy với các phương thức RegExp(): test() và exec().

Cũng có một số phương thức chuỗi cho phép bạn truyền biểu thức chính quy làm tham số. Chúng bao gồm: match(), replace(), search(), và split().

Phương thức	Mô tả
exec()	Thực thi tìm kiếm để tìm kết quả trùng khớp trong chuỗi và trả về một mảng thông tin. Trả về giá trị null nếu không trùng khớp.
test()	Kiểm tra sự trùng khớp trong chuỗi và trả về true hoặc false.
match()	Trả về một mảng chứa tất cả các kết quả trùng khớp. Trả về giá trị null nếu không trùng khớp.
matchAll()	Trả về một trình duyệt chứa tất cả các kết quả trùng khớp.
search()	Kiểm tra sự trùng khớp trong chuỗi và trả về chỉ mục của kết quả trùng khớp. Trả về -1 nếu tìm kiếm thất bại.
replace()	Tìm kiếm kết quả trùng khớp trong chuỗi và thay thế phần chuỗi trùng khớp bằng phần chuỗi thay thế.
split()	Tách chuỗi thành một mảng các phần con.

Ví dụ 1: Biểu thức Chính Quy

const string = 'Find me';
const pattern = /me/;

// search if the pattern is in string variable
const result1 = string.search(pattern);
console.log(result1); // 5

// replace the character with another character
const string1 = 'Find me';
string1.replace(pattern, 'found you'); // Find found you

// splitting strings into array elements
const regex1 = /[\s,]+/;
const result2 = 'Hello world! '.split(regex1);
console.log(result2); // ['Hello', 'world!', '']

// searching the phone number pattern
const regex2 = /(\d{3})\D(\d{3})-(\d{4})/g;
const result3 = regex2.exec('My phone number is: 555 123-4567.');
console.log(result3); // ["555 123-4567", "555", "123", "4567"]

---

Cờ Biểu thức Chính Quy

Cờ được sử dụng với biểu thức chính quy cho phép nhiều tùy chọn như tìm kiếm toàn cầu, tìm kiếm không phân biệt chữ hoa chữ thường, vv. Chúng có thể được sử dụng riêng lẻ hoặc cùng nhau.

Cờ	Mô tả
g	Thực hiện tìm kiếm toàn cầu (tìm tất cả kết quả trùng khớp)
m	Thực hiện tìm kiếm theo dòng
i	Thực hiện tìm kiếm không phân biệt chữ hoa chữ thường

Ví dụ 2: Bộ điều chỉnh Biểu thức Chính Quy

const string = 'Hello hello hello';

// performing a replacement
const result1 = string.replace(/hello/, 'world');
console.log(result1); // Hello world hello

// performing global replacement
const result2 = string.replace(/hello/g, 'world');
console.log(result2); // Hello world world

// performing case-insensitive replacement
const result3 = string.replace(/hello/i, 'world');
console.log(result3); // world hello hello

// performing global case-insensitive replacement
const result4 = string.replace(/hello/gi, 'world');
console.log(result4); // world world world

---

Ví dụ 3: Xác minh Số Điện Thoại

// program to validate the phone number

function validatePhone(num) {

    // regex pattern for phone number
    const re = /^\(?([0-9]{3})\)?[-. ]?([0-9]{3})[-. ]?([0-9]{4})$/g;

    // check if the phone number is valid
    let result = num.match(re);
    if (result) {
        console.log('The number is valid.');
    }
    else {
        let num = prompt('Enter number in XXX-XXX-XXXX format:');
        validatePhone(num);
    }
}

// take input
let number = prompt('Enter a number XXX-XXX-XXXX');

validatePhone(number);

Run Code

Kết quả

Enter a number XXX-XXX-XXXX: 2343223432
Enter number in XXX-XXX-XXXX format: 234-322-3432
The number is valid

---

Ví dụ 4: Xác minh Địa Chỉ Email

// program to validate the email address

function validateEmail(email) {

    // regex pattern for email
    const re = /\S+@\S+\.\S+/g;

    // check if the email is valid
    let result = re.test(email);
    if (result) {
        console.log('The email is valid.');
    }
    else {
        let newEmail = prompt('Enter a valid email:');
        validateEmail(newEmail);
    }
}

// take input
let email = prompt('Enter an email: ');

validateEmail(email);

Run Code

Kết quả

Enter an email: hellohello
Enter a valid email: learningJS@gmail.com
The email is valid.

---

• Bài đăng blog này ban đầu được xuất bản tại:https://www.programiz.com/