Hi, I am

Ngô Tôn

I am a programmer.

Home / Programming / Web Development / Javascript / Regular Expression trong JavaScript

Regular Expression trong JavaScript

1. RegEx là gì?

RegEx (Regular Expression) là một biểu thức thường được dùng để mô tả một mẫu chuỗi (string pattern).

2. Vậy, mẫu chuỗi là gì?

Mẫu chuỗi, diễn giải thô ra có nghĩa là các chuỗi văn bản tuân thủ theo một quy luật sắp xếp (mẫu) nào đó.

Ví dụ:
– Một số được viết dưới dạng một chuỗi với các chữ số, có thể có chứa tối đa 1 dấu phẩy ở giữa.
– Dữ liệu kiểu ngày tháng: Thường được viết theu mẫu: dd/mm/yyyy: Hai chữ số đầu tiên xác định ngày, tiếp theo là dấu gạch chéo, tiếp đến là 2 chữ số xác định tháng, tiếp theo là dấu gạch chéo và kết thúc bởi bốn chữ số xác định năm.
– Địa chỉ email: xxx@yyy.zz.gìđó: Bao gồm 1 chuỗi văn bản được chia thành 2 phần: Phần user name và phần domain, 2 phần này cách nhau bởi dấu @. Phần domain có luật riêng theo cách đặt tên của domain…

3. Khái niệm về biểu thức:

Một biểu thức bao gồm các toán tử và các toán hạng
Toán tử: Các phép toán (VD: cộng, trừ, nhân, chia, lặp, gộp, so sánh…)
Toán hạng: Biến, giá trị được dùng để tính toán.

4. Vậy regex được dùng để làm gì và nó có tác dụng gì?

Trong các kỹ thuật xử lý chuỗi (VD: Tìm kiếm, thay thế…) thông thường, chúng ta cần phải xác định các chuỗi tường minh để tìm kiếm. Các chuỗi này được gọi là từ khoá.

Tuy nhiên, trong một số trường hợp ngoại lệ khác, chúng ta không thể chỉ định rõ chuỗi từ khoá đó, mà chỉ có thể mô tả được quy luật để sinh ra chuỗi từ khoá đó.

VD: Làm thế nào để lấy được toàn bộ địa chỉ email trong một văn bản?
Rõ ràng với câu hỏi này, bằng mắt thường thì ta có thể lấy được, còn bằng con đường lập trình thông thường theo kiểu tìm kiếm bằng từ khoá là các địa chỉ email thì chúng ta … bó tay.

Nhưng nếu có regex, chúng ta có thể thiết lập ra quy luật của một địa chỉ email và yêu cầu chương trinh tìm kiếm theo luật đó.

Cú pháp khai báo regex trong JavaScript

Chúng ta có thể khai báo biến chứa regex như sau:

Code:
g: (“global” matching): Lặp lại quá trình tìm kiếm cho đến khi kết thúc chuỗi. Khi sử dụng phương thức replace(), giá trị này sẽ thay thế tất cả các cụm từ tìm thấy thay vì chỉ cụm từ đầu tiên.
i: so sánh không phân biệt hoa thường.
m: so sánh ở chế độ đa dòng.
Có thể phối hợp nhiều cách_tìm. VD: gi. Cũng có thể không cần đưa tham số này vào

Các phương thức có hỗ trợ regEx trong JavaScript:

Giả sử có một biến chuỗi S:
S.search(): Tìm chuỗi phù hợp với biểu thức đã cho và trả về vị trí của chuỗi đó
S.match(): Tìm chuỗi theo mẫu và trả về một mảng các giá trị tìm thấy
S.replace() Thay thế chuỗi bằng chuỗi khác phù hợp với mẫu tìm kiếm.

Các bạn có thể tìm hiểu cách sử dụng các hàm này trên mạng, ở đây tôi chỉ sử dụng hàm match để demo cách sử dụng regex. Nên nhớ, hàm match() này trả về một mảng các giá trị phù hợp với mẫu chuỗi cần tìm.

Ví dụ đơn giản đầu tiên về regex:

Đoạn mã dưới đây trả về mảng các chuỗi có chứa chữ thu:
Code:

Đoạn ví dụ thứ 2 chỉ tìm kiếm các mẫu chuỗi chứa duy nhất chữ t:
Code:
Các phép toán tìm kiếm theo vị trí

^: Trả về chuỗi kết quả trong trường hợp chuỗi này nằm ở vị trí đầu của chuỗi gốc
$: Trả về chuỗi kết quả trong trường hợp chuỗi này nằm ở vị trí cuối của chuỗi gốc
\b: Trả về chuỗi kết quả trong trường hợp chuỗi này nằm ở vị trí đầu của một từ trong chuỗi gốc. Nếu cần so sánh ở vị trí cuối từ, hãy đặt biểu thức \b ở vị trí cuối từ.
\B: Trả về chuỗi kết quả trong trường hợp chuỗi này không nằm ở vị trí đầu của một từ trong chuỗi gốc. (tuỳ thuộc vào vị trí đặt \B ở đầu hoặc cuối một từ)
?=: Trả về chuỗi kết quả nếu theo sau chuỗi đó là một chuỗi nào đó được chỉ định trước
?!: Trả về chuỗi kết quả nếu sau chuỗi đó không phải là một chuỗi nào đó được chỉ định trước

Ví dụ:
Code:

Các lớp ký tự trong regex:

[xyz]: Tìm một ký tự bất kỳ nằm trong tập ký tự giữa cặp dấu ngoặc vuông
[x-z]: Tìm một ký tự bất kỳ nằm trong tập ký tự từ x đến z
[^xyz]: Tìm một ký tự bất kỳ không thuộc tập ký tự giữa cặp dấu ngoặc vuông.
.: Tìm bất kỳ một ký tự nào không phải là ký tự xuống dòng mới (new line) hoặc ký tự kết thúc dòng (line terminator).
\w: Tìm một ký tự dạng a-Z, 0-9 và dấu gạch dưới.
\W: Ngược lại với \w
\d: Tìm một ký tự thuộc tập ký tự từ 0 đến 9
\D: Ngược lại với \d: Tìm một ký tự không nằm trong tập ký tự từ 0 đến 9
\s: Tìm ký tự cách (dấu cách)
\S:Tìm một ký tự không phải là dấu cách

Ví dụ:
Code:

Các phép lặp trong regex

RegEx cho phép tìm kiếm lặp bên trong biểu thức:
{x}: Lặp một ký tự hoặc một biểu thức con trước đó x lần
{x,y}: Lặp một ký tự hoặc một biểu thức con trước đó từ x đến y lần
{x,}: Lặp một ký tự hoặc một biểu thức con trước đó >= x lần
?: Lặp một ký tự hoặc một biểu thức con trước đó 0 hoặc 1 lần
*: Lặp một ký tự hoặc một biểu thức con trước đó >=0 lần
+: Lặp một ký tự hoặc một biểu thức con trước đó >=1 lần

Ví dụ:
Code:

Gộp nhóm các biểu thức
Chúng ta có thể sử dụng các dấu ngoặc tròn () để gộp nhóm như trong các biểu thức toán học thông thường.

(): Tìm kiếm một nhóm các ký tự bên trong cặp dấu ngoặc và lưu vào chuỗi kết quả.
(?: ): Tìm kiếm chuỗi kết quả không chứa tập ký tự nằm trong cặp dấu ngoặc.
|: Phép toán hoặc, được sử dụng để kết hợp các mệnh đề với nhau vào chung một biểu thức

Ví dụ:
Code:

Ứng dụng

Ở phần trên, các bạn hẳn đã hiểu được regex là cái gì, và bước đầu có thể đọc hiểu được ý nghĩa của một chuỗi regex. Bài này đi vào tìm hiểu một số ví dụ ứng dụng regex để xử lý các bài toán trong thực tiễn.

I. Tìm kiếm và thay thế
Hẳn các bạn đã biết, phương thức replace() trong Javascript nếu ở chế độ bình thường thì nó sẽ chỉ tìm và thay thế được duy nhất chuỗi đầu tiên được tìm thấy.
VD:
Code:

Vậy làm thế nào để thay thế được tất cả các từ “chuoi” thành “cam”?

Ở đây, chúng ta có thể sử dụng các phép tìm kiếm lặp của regex:

Code:
II. Hỗ trợ kiểm tra dữ liệu theo mẫu regex

Ở đây các bạn cần làm quen với một phương thức trong lớp RegExp của javascript, đó là phương thức test().

Cú pháp:
biến_regex.test(chuỗi_gốc)

Phương thức này trả về true nếu như chuỗi gốc khớp với giá trị trả về của biến_regex. Ngược lại là false.

Ví dụ:
Code:

Kiểm tra xem chuỗi nhập vào có phải là 1 số hay không?

Bình thường, chúng ta có thể sử dụng các hàm kết hợp như: isNaN, parseInt, parseFloat… để kiểm tra xem đó có phải là một số hay không? Ở đây tôi cung cấp một cách khác dùng regex:

Đoạn mã dưới đây sẽ chỉ kiểm tra xem đây có phải là 1 số nguyên dương hay không:
Code:

Đoạn mã dưới đây sẽ kiểm tra xem có phải là đầu vào là 1 số nguyên hay ko (có thể có thêm dấu +/- ở trước):
Code:
Tiếp tục nâng cấp kiểm tra xem chuỗi đầu vào có phải là một số thực hay không.
Một chuỗi được coi là 1 số thực nếu như nó bắt đầu bởi 1 chuỗi số, có 1 dấu chấm ở giữa và kết thúc bởi 1 chuỗi số:
Code:
Nhưng mẫu chuỗi trên sẽ trả về false nếu người dùng gõ 1 chuỗi dạng 123,123,123.45
Hi vọng bài viết giúp ích cho các bạn trong lập trình web.
Tham khảo thêm phpvn.org.
1. RegEx là gì? RegEx (Regular Expression) là một biểu thức thường được dùng để mô tả một mẫu chuỗi (string pattern). 2. Vậy, mẫu chuỗi là gì? Mẫu chuỗi, diễn giải thô ra có nghĩa là các chuỗi văn bản tuân thủ theo một quy luật sắp xếp (mẫu) nào đó. Ví dụ: - Một số được viết dưới dạng một chuỗi với các chữ số, có thể có chứa tối đa 1 dấu phẩy ở giữa. - Dữ liệu kiểu ngày tháng: Thường được viết theu mẫu: dd/mm/yyyy: Hai chữ số đầu tiên xác định ngày, tiếp theo…

User Rating: 5 ( 1 votes)

About ngoton

Ngô Tôn is a programmer. He is crazy about new gadgets and up to date with latest technology trends. Use comments to notify any issues you are facing.

Check Also

playlist

Hướng dẫn làm Playlist bằng HTML, CSS, Jquery

Hôm nay, Ngô Tôn .IT xin hướng dẫn các bạn làm 1 trang web playlist nhạc …

Leave a Reply

Your email address will not be published. Required fields are marked *