Quan tâm đến việc học JavaScript? Nhận sách điện tử của tôi tại jshandbook.com
Giới thiệu về biểu thức chính quy
Một biểu thức chính quy (còn được gọi là biểu thức chính quy ngắn gọn) là một cách nhanh chóng để làm việc với các chuỗi văn bản.
Bằng cách xây dựng một biểu thức chính quy với một cú pháp đặc biệt, bạn có thể:
- tìm kiếm văn bản trong một chuỗi
- thay thế chuỗi con trong một chuỗi
- và trích xuất thông tin từ một chuỗi
Hầu hết mọi ngôn ngữ lập trình đều có một số triển khai các biểu thức chính quy. Có sự khác biệt nhỏ giữa mỗi lần triển khai, nhưng các khái niệm chung được áp dụng ở hầu hết mọi nơi.
Biểu thức chính quy có từ những năm 1950, khi chúng được chính thức hóa thành một mẫu tìm kiếm khái niệm cho các thuật toán xử lý chuỗi.
Được triển khai trong các công cụ UNIX như grep, sed và trong các trình soạn thảo văn bản phổ biến, biểu thức chính quy ngày càng phổ biến. Chúng được đưa vào ngôn ngữ lập trình Perl, và sau đó là nhiều ngôn ngữ khác nữa.
JavaScript, cùng với Perl, là một trong những ngôn ngữ lập trình hỗ trợ các biểu thức chính quy được tích hợp trực tiếp vào ngôn ngữ.
Khó nhưng hữu ích
Các biểu thức chính quy có vẻ hoàn toàn vô nghĩa đối với người mới bắt đầu và nhiều lần đối với nhà phát triển chuyên nghiệp, nếu bạn không đầu tư thời gian cần thiết để hiểu chúng.
Biểu thức chính quy mật mã là khó viết, khó để đọcvà khó duy trì/sửa đổi.
Nhưng đôi khi một biểu thức chính quy là cách lành mạnh duy nhất để thực hiện một số thao tác với chuỗi, vì vậy đây là một công cụ rất có giá trị trong túi của bạn.
Hướng dẫn này nhằm mục đích giới thiệu cho bạn về Biểu thức chính quy JavaScript theo cách đơn giản và cung cấp cho bạn tất cả thông tin để đọc và tạo biểu thức chính quy.
Nguyên tắc chung là biểu thức chính quy đơn giản là đơn giản để đọc và viếttrong khi biểu thức chính quy phức tạp có thể nhanh chóng biến thành một mớ hỗn độn nếu bạn không nắm bắt sâu những điều cơ bản.
Biểu thức chính quy trông như thế nào?
Trong JavaScript, một biểu thức chính quy là một vậtcó thể được định nghĩa theo hai cách.
Đầu tiên là bằng cách khởi tạo một đối tượng RegExp mới sử dụng hàm tạo:
const re1 = new RegExp('hey')
Thứ hai là sử dụng biểu thức chính quy theo nghĩa đen mẫu đơn:
const re1 = /hey/
Bạn biết rằng JavaScript có đối tượng chữ và mảng chữ? Nó cũng có chữ regex.
Trong ví dụ trên, hey
nó được gọi là mẫu. Ở dạng chữ, nó được phân định bằng dấu gạch chéo về phía trước, trong khi với hàm tạo đối tượng thì không.
Đây là sự khác biệt quan trọng đầu tiên giữa hai hình thức, nhưng chúng ta sẽ thấy những điểm khác sau.
Làm thế nào nó hoạt động?
Biểu thức chính quy chúng tôi đã định nghĩa là re1
ở trên là một điều rất đơn giản. Nó tìm kiếm chuỗi hey
, không giới hạn. Chuỗi có thể chứa nhiều văn bản và hey
ở giữa và regex được thỏa mãn. Nó cũng có thể chỉ chứa hey
và regex cũng sẽ hài lòng.
Điều đó khá đơn giản.
Bạn có thể kiểm tra regex bằng cách sử dụng RegExp.test(String)
trả về một boolean:
re1.test('hey') //✅ re1.test('blablabla hey blablabla') //✅ re1.test('he') //❌ re1.test('blablabla') //❌
Trong ví dụ trên, chúng ta vừa kiểm tra xem "hey"
thỏa mãn mẫu biểu thức chính quy được lưu trữ trong re1
.
Đây là cách đơn giản nhất có thể, nhưng bây giờ bạn đã biết rất nhiều khái niệm về biểu thức chính quy.
thả neo
/hey/
diêm hey
bất cứ nơi nào nó được đặt bên trong chuỗi.
Nếu bạn muốn khớp các chuỗi bắt đầu với hey
sử dụng ^
nhà điều hành:
/^hey/.test('hey') //✅ /^hey/.test('bla hey') //❌
Nếu bạn muốn khớp các chuỗi chấm dứt với hey
sử dụng $
nhà điều hành:
/hey$/.test('hey') //✅ /hey$/.test('bla hey') //✅ /hey$/.test('hey you') //❌
Kết hợp chúng và khớp các chuỗi khớp chính xác hey
và chỉ chuỗi đó:
/^hey$/.test('hey') //✅
Để khớp một chuỗi bắt đầu bằng một chuỗi con và kết thúc bằng một chuỗi khác, bạn có thể sử dụng .*
khớp với bất kỳ ký tự nào được lặp lại 0 lần trở lên:
/^hey.*joe$/.test('hey joe') //✅ /^hey.*joe$/.test('heyjoe') //✅ /^hey.*joe$/.test('hey how are you joe') //✅ /^hey.*joe$/.test('hey joe!') //❌
Khớp các mục trong phạm vi
Thay vì khớp một chuỗi cụ thể, bạn có thể chọn khớp bất kỳ ký tự nào trong một phạm vi, chẳng hạn như:
/[a-z]/ //a, b, c, ... , x, y, z /[A-Z]/ //A, B, C, ... , X, Y, Z /[a-c]/ //a, b, c /[0-9]/ //0, 1, 2, 3, ... , 8, 9
Các biểu thức chính quy này khớp với các chuỗi chứa ít nhất một trong các ký tự trong các phạm vi đó:
/[a-z]/.test('a') //✅ /[a-z]/.test('1') //❌ /[a-z]/.test('A') //❌ /[a-c]/.test('d') //❌ /[a-c]/.test('dc') //✅
Phạm vi có thể được kết hợp:
/[A-Za-z0-9]/
/[A-Za-z0-9]/.test('a') //✅ /[A-Za-z0-9]/.test('1') //✅ /[A-Za-z0-9]/.test('A') //✅
Khớp một mục phạm vi nhiều lần
Bạn có thể kiểm tra xem một chuỗi có chứa một và chỉ một ký tự trong một phạm vi hay không bằng cách sử dụng -
ký tự:
/^[A-Za-z0-9]$/
/^[A-Za-z0-9]$/.test('A') //✅ /^[A-Za-z0-9]$/.test('Ab') //❌
phủ nhận một mô hình
Các ^
ký tự ở đầu mẫu neo nó vào đầu chuỗi.
Được sử dụng bên trong một phạm vi, nó phủ định nó, vì vậy:
/[^A-Za-z0-9]/.test('a') //❌ /[^A-Za-z0-9]/.test('1') //❌ /[^A-Za-z0-9]/.test('A') //❌ /[^A-Za-z0-9]/.test('@') //✅
\d
khớp với bất kỳ chữ số nào, tương đương với[0-9]
\D
khớp với bất kỳ ký tự nào không phải là chữ số, tương đương với[^0-9]
\w
khớp với bất kỳ ký tự chữ và số nào, tương đương với[A-Za-z0-9]
\W
khớp với bất kỳ ký tự không phải chữ và số nào, tương đương với[^A-Za-z0-9]
\s
khớp với bất kỳ ký tự khoảng trắng nào: dấu cách, tab, dòng mới và dấu cách Unicode\S
khớp với bất kỳ ký tự nào không phải là khoảng trắng\0
phù hợp với null\n
phù hợp với một ký tự dòng mới\t
khớp với một ký tự tab\uXXXX
khớp một ký tự unicode với mã XXXX (yêu cầuu
lá cờ).
khớp với bất kỳ ký tự nào không phải là ký tự xuống dòng (ví dụ:\n
) (trừ khi bạn sử dụngs
cờ, giải thích sau)[^]
khớp với bất kỳ ký tự nào, kể cả ký tự xuống dòng. Nó hữu ích trên các chuỗi nhiều dòng.
Lựa chọn biểu thức chính quy
Nếu bạn muốn tìm kiếm một chuỗi hoặc khác, sử dụng |
nhà điều hành.
/hey|ho/.test('hey') //✅ /hey|ho/.test('ho') //✅
định lượng
Giả sử bạn có biểu thức chính quy này để kiểm tra xem một chuỗi có một chữ số trong đó hay không và không có gì khác:
/^\d$/
Bạn có thể dùng các ?
định lượng để biến nó thành tùy chọn, do đó yêu cầu không hoặc một:
/^\d?$/
nhưng nếu bạn muốn khớp nhiều chữ số thì sao?
Bạn có thể làm điều đó theo 4 cách, sử dụng +
, *
, {n}
và {n,m}
. Hãy xem xét từng cái một.
+
Ghép một hoặc nhiều (>=1) mục
/^\d+$/
/^\d+$/.test('12') //✅ /^\d+$/.test('14') //✅ /^\d+$/.test('144343') //✅ /^\d+$/.test('') //❌ /^\d+$/.test('1a') //❌
*
Khớp 0 hoặc nhiều (>= 0) mục
/^\d+$/
/^\d*$/.test('12') //✅ /^\d*$/.test('14') //✅ /^\d*$/.test('144343') //✅ /^\d*$/.test('') //✅ /^\d*$/.test('1a') //❌
{n}
khớp chính xác n
mặt hàng
/^\d{3}$/
/^\d{3}$/.test('123') //✅ /^\d{3}$/.test('12') //❌ /^\d{3}$/.test('1234') //❌ /^[A-Za-z0-9]{3}$/.test('Abc') //✅
{n,m}
Trận đấu giữa n
và m
lần:
/^\d{3,5}$/
/^\d{3,5}$/.test('123') //✅ /^\d{3,5}$/.test('1234') //✅ /^\d{3,5}$/.test('12345') //✅ /^\d{3,5}$/.test('123456') //❌
m
có thể được bỏ qua để có một kết thúc mở, vì vậy bạn có ít nhất n
mặt hàng:
/^\d{3,}$/
/^\d{3,}$/.test('12') //❌ /^\d{3,}$/.test('123') //✅ /^\d{3,}$/.test('12345') //✅ /^\d{3,}$/.test('123456789') //✅
Các mặt hàng tùy chọn
Theo dõi một mục với ?
làm cho nó tùy chọn:
/^\d{3}\w?$/
/^\d{3}\w?$/.test('123') //✅ /^\d{3}\w?$/.test('123a') //✅ /^\d{3}\w?$/.test('123ab') //❌
Các nhóm
Sử dụng dấu ngoặc đơn, bạn có thể tạo các nhóm ký tự: (...)
Ví dụ này khớp chính xác 3 chữ số theo sau là một hoặc nhiều ký tự chữ và số:
/^(\d{3})(\w+)$/
/^(\d{3})(\w+)$/.test('123') //❌ /^(\d{3})(\w+)$/.test('123s') //✅ /^(\d{3})(\w+)$/.test('123something') //✅ /^(\d{3})(\w+)$/.test('1234') //✅
Các ký tự lặp đặt sau dấu ngoặc đơn đóng nhóm đề cập đến toàn bộ nhóm:
/^(\d{2})+$/
/^(\d{2})+$/.test('12') //✅ /^(\d{2})+$/.test('123') //❌ /^(\d{2})+$/.test('1234') //✅
Chụp nhóm
Cho đến nay, chúng ta đã biết cách kiểm tra các chuỗi và kiểm tra xem chúng có chứa một mẫu nhất định hay không.
Một tính năng rất hay của biểu thức chính quy là khả năng chụp các phần của một chuỗivà đặt chúng vào một mảng.
Bạn có thể làm như vậy bằng cách sử dụng Nhóm và đặc biệt là Chụp nhóm.
Theo mặc định, một Nhóm là một Nhóm chụp. Bây giờ, thay vì sử dụng RegExp.test(String)
chỉ trả về giá trị boolean nếu mẫu thỏa mãn, chúng tôi sử dụng một trong hai String.match(RegExp)
hoặc RegExp.exec(String)
.
Chúng hoàn toàn giống nhau và trả về một Mảng có toàn bộ chuỗi phù hợp trong mục đầu tiên, sau đó là từng nội dung nhóm phù hợp.
Nếu không khớp, nó sẽ trả về null
:
'123s'.match(/^(\d{3})(\w+)$/) //Array [ "123s", "123", "s" ]
/^(\d{3})(\w+)$/.exec('123s') //Array [ "123s", "123", "s" ]
'hey'.match(/(hey|ho)/) //Array [ "hey", "hey" ]
/(hey|ho)/.exec('hey') //Array [ "hey", "hey" ]
/(hey|ho)/.exec('ha!') //null
Khi một nhóm được so khớp nhiều lần, chỉ có kết quả khớp cuối cùng được đưa vào mảng kết quả:
'123456789'.match(/(\d)+/) //Array [ "123456789", "9" ]
nhóm tùy chọn
Một nhóm chụp có thể được thực hiện tùy chọn bằng cách sử dụng (...)?
. Nếu không tìm thấy, vị trí mảng kết quả sẽ chứa undefined
:
/^(\d{3})(\s)?(\w+)$/.exec('123 s') //Array [ "123 s", "123", " ", "s" ]
/^(\d{3})(\s)?(\w+)$/.exec('123s') //Array [ "123s", "123", undefined, "s" ]
Các nhóm đối sánh tham chiếu
Mỗi nhóm phù hợp được gán một số. $1
đề cập đến đầu tiên, $2
đến thứ hai, v.v. Điều này sẽ hữu ích khi chúng ta nói về việc thay thế các phần của chuỗi sau này.
Các nhóm chụp được đặt tên
Đây là một tính năng mới của ES2018.
Một nhóm có thể được gán cho một tên, thay vì chỉ được gán một vị trí trong mảng kết quả:
const re = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/ const result = re.exec('2015-01-02')
// result.groups.year === '2015'; // result.groups.month === '01'; // result.groups.day === '02';

Sử dụng match và exec không có nhóm
Có một sự khác biệt giữa việc sử dụng match
và exec
không có nhóm: mục đầu tiên trong mảng không phải là toàn bộ chuỗi khớp, mà là khớp trực tiếp:
/hey|ho/.exec('hey') // [ "hey" ]
/(hey).(ho)/.exec('hey ho') // [ "hey ho", "hey", "ho" ]
Nhóm không bắt giữ
Vì theo mặc định, các nhóm là Nhóm chụp, bạn cần một cách để bỏ qua một số nhóm trong mảng kết quả. Điều này có thể sử dụng Nhóm không bắt giữbắt đầu bằng một (?:...)
'123s'.match(/^(\d{3})(?:\s)(\w+)$/)//null
'123 s'.match(/^(\d{3})(?:\s)(\w+)$/) //Array [ "123 s", "123", "s" ]
cờ
Bạn có thể sử dụng các cờ sau trên bất kỳ biểu thức chính quy nào:
g
: khớp với mẫu nhiều lầni
: làm cho trường hợp regex không nhạy cảmm
: bật chế độ nhiều dòng. Ở chế độ này,^
và$
khớp với phần đầu và phần cuối của toàn bộ chuỗi. Không có điều này, với các chuỗi nhiều dòng, chúng khớp với phần đầu và phần cuối của mỗi dòng.u
: cho phép hỗ trợ unicode (được giới thiệu trong ES6/ES2015)s
: (mới trong ES2018) viết tắt của dòng duy nhấtnó gây ra.
để khớp với các ký tự dòng mới.
Các cờ có thể được kết hợp và chúng được thêm vào cuối chuỗi theo ký tự biểu thức chính quy:
/hey/ig.test('HEy') //✅
hoặc làm tham số thứ hai với các hàm tạo đối tượng RegExp:
new RegExp('hey', 'ig').test('HEy') //✅
Kiểm tra một regex
Đưa ra một biểu thức chính quy, bạn có thể kiểm tra các thuộc tính của nó:
source
chuỗi mẫumultiline
đúng vớim
lá cờglobal
đúng vớig
lá cờignoreCase
đúng vớii
lá cờlastIndex
/^(\w{3})$/i.source //"^(\\d{3})(\\w+)$" /^(\w{3})$/i.multiline //false /^(\w{3})$/i.lastIndex //0 /^(\w{3})$/i.ignoreCase //true /^(\w{3})$/i.global //false
bỏ trốn
Những ký tự này là đặc biệt:
Chúng đặc biệt vì chúng là các ký tự điều khiển có ý nghĩa trong mẫu biểu thức chính quy. Nếu bạn muốn sử dụng chúng bên trong mẫu dưới dạng các ký tự phù hợp, bạn cần thoát khỏi chúng bằng cách thêm dấu gạch chéo ngược:
/^\\$/ /^\^$/ // /^\^$/.test('^') ✅ /^\$$/ // /^\$$/.test('$') ✅
ranh giới chuỗi
\b
và \B
cho phép bạn kiểm tra xem một chuỗi ở đầu hay cuối từ:
\b
khớp với một tập hợp các ký tự ở đầu hoặc cuối của một từ\B
khớp với một tập hợp các ký tự không ở đầu hoặc cuối của một từ
Ví dụ:
'I saw a bear'.match(/\bbear/) //Array ["bear"] 'I saw a beard'.match(/\bbear/) //Array ["bear"] 'I saw a beard'.match(/\bbear\b/) //null 'cool_bear'.match(/\bbear\b/) //null
Thay thế, sử dụng Biểu thức chính quy
Chúng ta đã biết cách kiểm tra xem một chuỗi có chứa mẫu hay không.
Chúng ta cũng đã xem cách trích xuất các phần của chuỗi thành một mảng, khớp với một mẫu.
Hãy xem làm thế nào để thay thế các phần của một chuỗi dựa trên một khuôn mẫu.
Các String
đối tượng trong JavaScript có một phương thức thay thế (), có thể được sử dụng mà không cần biểu thức chính quy để thực hiện một thay thế duy nhất trên một chuỗi:
"Hello world!".replace('world', 'dog') //Hello dog!
"My dog is a good dog!".replace('dog', 'cat') //My cat is a good dog!
Phương thức này cũng chấp nhận một biểu thức chính quy làm đối số:
"Hello world!".replace(/world/, 'dog') //Hello dog!
Sử dụng g
cờ là cách duy nhất để thay thế nhiều lần xuất hiện trong một chuỗi trong vanilla JavaScript:
"My dog is a good dog!".replace(/dog/g, 'cat') //My cat is a good cat!
Các nhóm cho phép chúng tôi làm những việc thú vị hơn, chẳng hạn như di chuyển xung quanh các phần của chuỗi:
"Hello, world!".replace(/(\w+), (\w+)!/, '$2: $1!!!') // "world: Hello!!!"
Thay vì sử dụng một chuỗi, bạn có thể sử dụng một hàm để thực hiện những điều thú vị hơn. Nó sẽ nhận được một số đối số giống như đối số được trả về bởi String.match(RegExp)
hoặc RegExp.exec(String)
với một số đối số phụ thuộc vào số lượng nhóm:
"Hello, world!".replace(/(\w+), (\w+)!/, (matchedString, first, second) => { console.log(first); console.log(second);
return `${second.toUpperCase()}: ${first}!!!` })
//"WORLD: Hello!!!"
tham lam
Biểu thức chính quy được cho là tham theo mặc định.
Nó có nghĩa là gì?
Lấy regex này:
/\$(.+)\s?/
Nó được cho là trích xuất một số tiền từ một chuỗi:
/\$(.+)\s?/.exec('This costs $100')[1] //100
nhưng nếu chúng ta có nhiều từ hơn sau con số, nó sẽ trở nên kỳ lạ:
/\$(.+)\s?/.exec('This costs $100 and it is less than $200')[1] //100 and it is less than $200
Tại sao? Bởi vì biểu thức chính quy sau dấu $ khớp với bất kỳ ký tự nào có .+
và nó sẽ không dừng lại cho đến khi đến cuối chuỗi. Sau đó, nó kết thúc vì \s?
làm cho không gian kết thúc tùy chọn.
Để khắc phục điều này, chúng ta cần yêu cầu biểu thức chính quy lười biếng và thực hiện số lượng khớp ít nhất có thể. Chúng ta có thể làm như vậy bằng cách sử dụng ?
ký hiệu sau bộ định lượng:
/\$(.+?)\s/.exec('This costs $100 and it is less than $200')[1] //100
tôi đã gỡ bỏ
?
sau đó\s
. Mặt khác, nó chỉ khớp với số đầu tiên, vì khoảng trắng là tùy chọn
Cho nên, ?
có nghĩa là những thứ khác nhau dựa trên vị trí của nó, bởi vì nó có thể vừa là một bộ định lượng vừa là một chỉ báo chế độ lười biếng.
Lookaheads: khớp một chuỗi tùy thuộc vào những gì theo sau nó
Sử dụng ?=
để khớp một chuỗi theo sau bởi một chuỗi con cụ thể:
/Roger(?=Waters)/
/Roger(?= Waters)/.test('Roger is my dog') //false /Roger(?= Waters)/.test('Roger is my dog and Roger Waters is a famous musician') //true
?!
thực hiện thao tác nghịch đảo, khớp nếu một chuỗi là không phải theo sau là một chuỗi con cụ thể:
/Roger(?!Waters)/
/Roger(?! Waters)/.test('Roger is my dog') //true /Roger(?! Waters)/.test('Roger Waters is a famous musician') //false
Lookbehinds: khớp một chuỗi tùy thuộc vào chuỗi nào đứng trước nó
Đây là một tính năng ES2018.
Lookaheads sử dụng ?=
Biểu tượng. sử dụng Lookbehinds ?&l
t;=.
/(?<=Roger) Waters/
/(?<=Roger) Waters/.test('Pink Waters is my dog') //false
/(?<=Roger) Waters/.test('Roger is my dog and Roger Waters is a famous musician') //true
Một cái nhìn phía sau bị phủ nhận bằng cách sử dụng ?&l
t;!:
/(?<!Roger) Waters/
/(?<!Roger) Waters/.test('Pink Waters is my dog') //true
/(?<!Roger) Waters/.test('Roger is my dog and Roger Waters is a famous musician') //false
Biểu thức chính quy và Unicode
Các u
cờ là bắt buộc khi làm việc với chuỗi Unicode. Đặc biệt, điều này áp dụng khi bạn có thể cần xử lý các ký tự trong mặt phẳng trung gian (những ký tự không có trong 1600 ký tự Unicode đầu tiên).
Biểu tượng cảm xúc là một ví dụ điển hình, nhưng chúng không phải là duy nhất.
Nếu bạn không thêm cờ đó, biểu thức chính quy đơn giản khớp với một ký tự này sẽ không hoạt động, vì đối với JavaScript, biểu tượng cảm xúc đó được biểu thị bên trong bằng 2 ký tự (xem Unicode trong JavaScript):
/^.$/.test('a') //✅ /^.$/.test('?') //❌ /^.$/u.test('?') //✅
So, always use the
u
lá cờ.
Unicode, just like normal characters, handle ranges:
/[a-z]/.test('a') //✅ /[1-9]/.test('1') //✅ /[?-?]/u.test('?') //✅ /[?-?]/u.test('?') //❌
JavaScript checks the internal code representation, so ? < ? < ? becau
se \u1F
436 < \
u1F43A <
; \u1F98A. Kiểm tra danh sách Biểu tượng cảm xúc đầy đủ để nhận các mã đó và tìm hiểu thứ tự (mẹo: bộ chọn Biểu tượng cảm xúc của macOS có một số biểu tượng cảm xúc theo thứ tự hỗn hợp, vì vậy đừng tin vào nó).
Unicode property escapes
Unicode property escapes
As we saw above, in a regular expression pattern you can use
\d
để khớp với bất kỳ chữ số nào, \s
để khớp với bất kỳ ký tự nào không phải là khoảng trắng, \w
để khớp với bất kỳ ký tự chữ và số nào, v.v.
The Unicode property escapes is an ES2018 feature that introduces a very cool feature, extending this concept to all Unicode characters introducing
\p{}
và phủ định của nó \P{}
.
Any Unicode character has a set of properties. For example
Script
xác định họ ngôn ngữ, ASCII
là một boolean đúng với các ký tự ASCII, v.v. Bạn có thể đặt thuộc tính này trong dấu ngoặc đơn của biểu đồ và biểu thức chính quy sẽ kiểm tra xem điều đó có đúng không:
/^\p{ASCII}+$/u.test('abc') //✅ /^\p{ASCII}+$/u.test('ABC@') //✅ /^\p{ASCII}+$/u.test('ABC?') //❌
ASCII_Hex_Digit
là một thuộc tính boolean khác kiểm tra xem chuỗi chỉ chứa các chữ số thập lục phân hợp lệ hay không:
/^\p{ASCII_Hex_Digit}+$/u.test('0123456789ABCDEF') //✅ /^\p{ASCII_Hex_Digit}+$/u.test('h') //❌
There are many other boolean properties, which you just check by adding their name in the graph parentheses, including
Uppercase
, Lowercase
, White_Space
, Alphabetic
, Emoji
và hơn thế nữa:
/^\p{Lowercase}$/u.test('h') //✅ /^\p{Uppercase}$/u.test('H') //✅
/^\p{Emoji}+$/u.test('H') //❌ /^\p{Emoji}+$/u.test('??') //✅
In addition to those binary properties, you can check any of the unicode character properties to match a specific value. In this example, I check if the string is written in the Greek or Latin alphabet:
/^\p{Script=Greek}+$/u.test('ελληνικά') //✅ /^\p{Script=Latin}+$/u.test('hey') //✅
Read more about all the properties you can use directly on the proposal.
Examples
Supposing a string has only one number you need to extract,
/\d+/
Hãy làm nó:
'Test 123123329'.match(/\d+/) // Array [ "123123329" ]
Match an email address
A simplistic approach is to check non-space characters before and after the
@
ký, sử dụng \S
:
/(\S+)@(\S+)\.(\S+)/
/(\S+)@(\S+)\.(\S+)/.exec('cop[email protected]') //["[email protected]", "copesc", "gmail", "com"]
This is a simplistic example, however, as many invalid emails are still satisfied by this regex.
Capture text between double quotes
Suppose you have a string that contains something in double quotes, and you want to extract that content.
The best way to do so is by using a capturing group, because we know the match starts and ends with
"
và chúng tôi có thể dễ dàng nhắm mục tiêu nó, nhưng chúng tôi cũng muốn xóa các trích dẫn đó khỏi kết quả của mình.
We’ll find what we need in
result[1]
:
const hello = 'Hello "nice flower"' const result = /"([^']*)"/.exec(hello) //Array [ "\"nice flower\"", "nice flower" ]
Get the content inside an HTML tag
For example get the content inside a span tag, allowing any number of arguments inside the tag:
/<span\b[^>]*>(.*?)<\/span>/
/<span\b[^>]*>(.*?)<\/span>/.exec('test')// null
/<span\b[^>]*>(.*?)<\/span>/.exec('<span>test</span>') // ["<span>test</span>", "test"]
/<span\b[^>]*>(.*?)<\/span>/.exec('<span class="x">test</span>') // ["<span class="x">test</span>", "test"]
Interested in learning JavaScript? Get my ebook at jshandbook.com