HomeLập trìnhJavaScriptVí dụ JavaScript...

Ví dụ JavaScript String.Replace() với RegEx


Biểu thức chính quy (còn được gọi là RegEx hoặc RegExp) là một cách hiệu quả để phân tích văn bản. Với RegEx, bạn có thể khớp các chuỗi tại các điểm khớp với các ký tự cụ thể (ví dụ: JavaScript) hoặc các mẫu (ví dụ: NumberStringSymbol – 3a&).

Các .replace phương thức được sử dụng trên các chuỗi trong JavaScript để thay thế các phần của chuỗi bằng các ký tự. Nó thường được sử dụng như vậy:

const str="JavaScript";
const newStr = str.replace("ava", "-");
console.log(newStr);
// J-Script

Như bạn có thể thấy ở trên, phương thức thay thế chấp nhận hai đối số: chuỗi được thay thế và chuỗi sẽ được thay thế bằng gì.

Đây là nơi biểu thức chính quy vào đi.

Việc sử dụng .replace ở trên bị giới hạn: các ký tự được thay thế đã biết – “ava”. Thay vào đó, nếu chúng ta quan tâm đến một mẫu thì sao? Có thể, một số, hai chữ cái và từ “foo” hoặc ba ký hiệu được sử dụng cùng nhau?

Các .replace phương pháp được sử dụng với RegEx có thể đạt được điều này. RegEx có thể được sử dụng hiệu quả để tạo lại các mẫu. Vì vậy, kết hợp điều này với .replace có nghĩa là chúng ta có thể thay thế các mẫu chứ không chỉ các ký tự chính xác.

Cách sử dụng RegEx với .replace trong JavaScript

Để sử dụng RegEx, đối số đầu tiên của replace sẽ được thay thế bằng cú pháp regex chẳng hạn /regex/. Cú pháp này đóng vai trò là một mẫu trong đó bất kỳ phần nào của chuỗi khớp với nó sẽ được thay thế bằng chuỗi con mới.

Đọc thêm  Đóng cửa trong JavaScript – Giải thích bằng các ví dụ

Đây là một ví dụ:

// matches a number, some characters and another number
const reg = /\d.*\d/
const str = "Java3foobar4Script"
const newStr = str.replace(reg, "-");
console.log(newStr);
// "Java-Script"

chuỗi 3foobar4 phù hợp với regex /\d.*\d/vì vậy nó được thay thế.

Nếu chúng tôi muốn thực hiện thay thế ở nhiều nơi thì sao?

Regex đã cung cấp điều đó với g (toàn cầu) cờ và có thể sử dụng tương tự với replace. Đây là cách:

const reg = /\d{3}/g
const str = "Java323Scr995ip4894545t";
const newStr = str.replace(reg, "");
console.log(newStr);
// JavaScrip5t
// 5 didn't pass the test :(

Regex khớp với các phần của chuỗi có chính xác 3 số liên tiếp. 323 phù hợp với nó, 995 phù hợp với nó, 489 phù hợp với nó, và 454 phù hợp với nó. Nhưng cuối cùng 5 không phù hợp với khuôn mẫu.

Kết quả là JavaScrip5t hiển thị cách các mẫu được khớp chính xác và thay thế bằng chuỗi con mới (một chuỗi trống).

Cờ trường hợp – i cũng có thể được sử dụng. Điều này có nghĩa là bạn có thể thay thế các mẫu không phân biệt chữ hoa chữ thường. Đây là cách nó được sử dụng:

const reg1 = /\dA/
const reg2 = /\dA/i
const str = "Jav5ascript"
const newStr1 = str.replace(reg1, "--");
const newStr2 = str.replace(reg2, "--");
console.log(newStr1) // Jav5ascript
console.log(newStr2) // Jav--script

..5a.. không khớp với cú pháp đầu tiên vì RegEx theo mặc định phân biệt chữ hoa chữ thường. Nhưng với việc sử dụng i cờ, như đã thấy trong cú pháp thứ hai, chuỗi như mong đợi – được thay thế.

Cách sử dụng Split với biểu thức chính quy

split cũng sử dụng RegEx. Điều đó có nghĩa là bạn có thể tách một chuỗi không chỉ ở các chuỗi con khớp với các ký tự chính xác mà còn cả các mẫu.

Đọc thêm  Sự kiện định thời gian JavaScript: setTimeout và setInterval

Đây là một cái nhìn nhanh:

const regex = /\d{2}a/;
const str = "Hello54 How 64aare you";
console.log(str.split(regex))
// ["Hello54 How ", "are you"]

chuỗi là split tại 64a vì chuỗi con đó khớp với biểu thức chính quy được chỉ định.

Lưu ý rằng lá cờ toàn cầu – g – Trong split không liên quan, không giống như i cờ và các cờ khác. Điều này là do split phân tách chuỗi tại một số điểm mà biểu thức chính quy phù hợp.

kết thúc

RegEx làm cho replacetạo chuỗi trong JavaScript hiệu quả hơn, mạnh mẽ hơn và thú vị hơn.

Bạn không chỉ bị giới hạn ở các ký tự chính xác mà cả các mẫu và nhiều thay thế cùng một lúc. Trong bài viết này, chúng ta đã thấy cách chúng hoạt động cùng nhau bằng một vài ví dụ.

Chúc mừng RegEx?



Zik.vn – Biên dịch & Biên soạn Lại

spot_img

Create a website from scratch

Just drag and drop elements in a page to get started with Newspaper Theme.

Buy Now ⟶

Bài viết liên quang

DMCA.com Protection Status