Regular Expression trong javascript chỉ bạn code javascript để đánh giá, tìm, trích xuất dữ liệu từ các chuỗi dựa trên 1 pattern cho trước.
A. Regular Expression là gì
Regular Expression (biểu thức chính quy) – viết tắt là regexp – là một chuỗi diễn tả một mẫu ký tự dùng để so khớp với 1 chuỗi khác. RexExp thường dùng trong các bài toán tìm kiếm và xử lý theo mẫu (trừu tượng) chứ không dựa vào những chuỗi ký tự cố định (rõ ràng), ví dụ:
- So khớp các giá trị nhập trong form với mẫu cho trước (dùng khi validate form)
- Tách chuỗi theo các mẫu cho trước
- Tìm kiếm chuỗi con theo công thức nào đó (ví dụ tìm chuỗi có 3 ký tự bắt đầu bằng T)
- Thay thế đoạn ký tự
B. Sử dụng regular expression trong javascript
Bạn có hai cách để dùng Regular expression trong javascript, đó là dùng regular expression literal và cách dùng đối tượng regexp.
1. Dùng Regular expression Literal (RexpExp thuần)
Cú pháp sử dụng như sau: pattern.test(string) Trong đó pattern là mẫu kiểm tra, còn string là chuỗi cần kiểm tra. Ví dụ:
<script>
pat =/^PS/;
masv = "PD1975327";
kq = pat.test(masv);
console.log(kq); //false
masv = "PS19327";
kq = pat.test(masv);
console.log(kq); //true
</script>2. Dùng đối tượng RegExp
Bạn tạo biểu thức Regular Expression bằng lệnh new RegExp
<script>
p = new RegExp("^PS");
masv1 = "ps1975327";
kq = p.test(masv1);
console.log(kq); //false
masv2 = "PS1975327";
kq = p.test(masv2);
console.log(kq); //true
</script>C. Sử dụng modifier cho RegExp
Bạn có thể chỉ định 1 số thay đổi (modifier) về cách hoạt động cho biểu thức regexp. Các modifier khai báo phía sau regexp (dùng nhiều modifier kết hợp nhau cũng được). Cú pháp dùng là thế này: /pattern/modifiers . Sau đây là các modifiers thường dùng :
- i : không phân biệt chữ hoa thường.
- g: tìm toàn chuỗi
- m: có xử lý ký tự xuống dòng khi so khớp
<script>
str = "Cơ tắc Xan hề khốn tắc miên";
mau = /xan/;
kq = mau.test(str);
console.log(kq); //false
mau = /xan/i;
kq = mau.test(str);
console.log(kq); //true
</script><script>
str = "Đời Đẹp Lắm";
p = new RegExp("đẹp");
kq = p.test(str);
console.log(kq); //false
p2 = new RegExp('đẹp','i');
kq = p2.test(str);
console.log(kq); //true
</script><script>
str = "Đời dep \nlam";
console.log(str);
mau =/^lam/;
kq = mau.test(str);
console.log(kq); //false
mau =/^lam/m;
kq = mau.test(str);
console.log(kq); //true
</script>D. Các hàm chuỗi dùng với Regular Expression
Sau đây là một số hàm chuỗi Bạn thường dùng với Regular Expression
- test() : Kiểm tra chuỗi có thõa mãn với mẫu không, kết quả true/false
- exec() : Trả về 1 mảng chứa thông tin của kết quả đầu tiên tìm được.
- match(): Đây là hàm trong chuỗi, trả về 1 mảng tất cả các giá trị khớp với mẫu
- search() : Đây là hàm trong chuỗi, trả về vị trí khớp với mẫu.
- replace() : Đây là hàm trong chuỗi, giúp tìm và thay thế
- split(): Đây là hàm trong chuỗi, giúp tách chuỗi thành mảng
<script>
str = "15, 290, 4683, 574, 78";
mau =/\d{3,4}/;
kq = mau.test(str);
console.log(kq); //true
mau =/\d{3,4}/;
kq = mau.exec(str);
console.log(kq);
//["290",index: 4,input:"15,290,4683,574,78",groups: undefined]
mau =/\d{3,4}/g;
kq = str.match(mau);
console.log(kq); //["290", "4683", "574"]
str="Nói từ từ nhưng phải suy nghĩ nhanh";
arr = str.split(/\s/);
console.log(arr);
//['Nói','từ','từ','nhưng','phải','suy','nghĩ','nhanh']
str="C&am ( on doi * moi som mai ? thuc day";
newstr = str.replace(/[^a-zA-Z0-9\s]/g,"");
console.log(newstr);
//Cam on doi moi som mai thuc day
</script>E. Các ký tự đặc biệt trong Regular Expression
Trong Regular Expression, Bạn có thể dùng số ký tự đặc biệt sau:
- [abc] : Kiểm tra chuỗi có chứa 1 trong các ký tự trong ngoặc vuông không
- [^abc] : Tìm các ký tự không phải là các ký tự trong ngoặc vuông
- [0-9] : diễn tả 1 ký số
- [a-z] : 1 ký tự thường
- [A-Z]: diễn tả 1 ký tự hoa
- (x|y) : tìm chuỗi khớp với x hoặc y]
- \d : diễn tả 1 ký số
- \D : diễn tả không phải ký số
- \s: diễn tả 1 khoảng trắng
- \w: diễn tả 1 word character (chữ cái), gồm a-z, A-Z, 0-9, _
- \W: diễn tả 1 non-word character (không phải chữ cái). Ví dụ các ký tự %, $, ! …
- \b: diễn tả dò tìm ở bắt đầu hoặc kết thúc 1 từ trong chuỗi. Ví dụ với mẫu \bLO tìm chữ LO nằm ở ví trí bắt đầu của các từ trong chuỗi, còn mẫu LO\b sẽ tìm chữ LO ở cuối các từ trong chuỗi. Tham khảo ví dụ ở đây : https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_regexp_boundary
<script>
str="Trước đèn xem chuyện Tây Minh. Ngẫm cười hai chữ nhân tình éo le";
mau=/[i\s]nh/g;
kq = str.match(mau);
console.log(kq); // ["inh", " nh"]
</script>- n+ : quét qua chuỗi để tìm chuỗi con n, số lượng ký tự n thể ít nhất 1
<script>
str = "Google.com";
kq = str.match(/o+/g);
console.log(kq); // ["oo", "o"]
</script>- n$: kiểm tra chuỗi có phải kết thúc bằng n không
<script>
domain1 = "longnv.name.vn"; domain2 = "google.com";
kq = /vn$/.test(domain1); console.log(kq); // true
kq = /vn$/.test(domain2); console.log(kq); // false
</script>- ^n: Kiểm tra chuỗi có phải bắt đầu bằng n không
<script>
url1= "https://longnv.name.vn"; url2 = "https://google.com";
kq = /^https/.test(url1); console.log(kq); // true
kq = /^http:\/\//.test(url2); console.log(kq); // false
</script>- n{x}: tìm chuỗi con chứa x ký tự n
<script>
svRot = "Lại Thi Hoài PS16742 Phạm Kỷ Luật PS18243 ";
arr_MaSV = svRot.match(/\d{5}/g);
console.log(arr_MaSV); // ["16742", "18243"]
</script>- n{x,y}: tìm chuỗi con chứa từ x đến y ký tự n
<script>
sotrang = "Bỉ Vỏ 238 Lĩnh Nam 1245 Bố già 305 Số Đỏ 98 ";
kq = sotrang.match(/\d{3,4}/g);
console.log(kq); // ["238", "1245", "305"]
</script>F. Luyện tập sử dụng Regular Expression trong javascript
Mời bạn thực hiện : Code như mẫu dưới, trong sự kiện onblur của input hãy thực hiện validate dữ liệu mà user đã gõ. Kiểm tra dữ liệu đó có phải định dạng số điện thoại hay không? Biết rằng số điện thoại bắt đầu bằng các đầu số: 09, 03 và có 10 chữ số
<div>
<label>Số điện thoại</label>
<input id="phonenum">
<span style="color:red" id="msgPhoneNum"></span>
</div><script>
inputPhoneNum = document.querySelector("#phonenum");
msgPhoneNum = document.querySelector("#msgPhoneNum");
inputPhoneNum.onblur=function(){
v = this.value;
pattern = /(09|03)+([0-9]{8}\b)/g;
if (pattern.test(v)==false){
msgPhoneNum.innerText="Bạn nhập không đúng số điện thoại";
}
else {
msgPhoneNum.innerText="";
}
}
</script>Regular Expression trong javascript vẫn chưa hết và nó có rất nhiều ứng dụng trong thực tế để xử lý chuỗi. Các em chịu khó thực tập nhé, tham khảo thêm tài liệu ở đây nè https://www.w3schools.com/jsref/jsref_obj_regexp.asp
