Regular Expressions สำหรับมือใหม่: รูปแบบที่เข้าใจได้จริง

Regular expressions (regex) มีชื่อเสียงว่าอ่านยาก แต่เมื่อคุณเรียนรู้ส่วนประกอบพื้นฐานแล้ว มันจะกลายเป็นหนึ่งในเครื่องมือที่ทรงพลังที่สุดในชุดเครื่องมือของนักพัฒนา — ตั้งแต่การตรวจสอบข้อมูลที่ผู้ใช้กรอก ไปจนถึงการค้นหาในไฟล์ log

Regular expression คืออะไร?

Regex คือ รูปแบบ (pattern) ที่อธิบายชุดของ strings คุณส่ง pattern และ string เป้าหมายให้กับ regex engine แล้วมันจะบอกว่า pattern นั้นตรงกัน (และตรงที่ตำแหน่งไหน) หรือไม่

const pattern = /hello/i;
pattern.test("Hello World"); // true

Flag /i ทำให้การจับคู่ไม่คำนึงถึงตัวพิมพ์เล็ก-ใหญ่ โดย flags จะอยู่หลัง / ปิดท้ายใน JavaScript

ส่วนประกอบพื้นฐานที่จำเป็น

Symbol	ความหมาย	ตัวอย่าง	จับคู่กับ
.	อักขระใดก็ได้ (ยกเว้นขึ้นบรรทัดใหม่)	h.t	hat, hit, hot
*	ศูนย์ครั้งหรือมากกว่าของตัวก่อนหน้า	ab*c	ac, abc, abbc
+	หนึ่งครั้งหรือมากกว่าของตัวก่อนหน้า	ab+c	abc, abbc (ไม่ใช่ ac)
?	ศูนย์หรือหนึ่งครั้งของตัวก่อนหน้า	colou?r	color, colour
\d	ตัวเลขใดก็ได้ (0–9)	\d{3}	123, 007
\w	อักขระคำ (ตัวอักษร, ตัวเลข, _)	\w+	hello, user_1
\s	Whitespace (ช่องว่าง, tab, ขึ้นบรรทัดใหม่)	\s+	จับคู่ช่องว่าง
^	จุดเริ่มต้นของ string	^Hello	Hello…
$	จุดสิ้นสุดของ string	world$	…world

Character classes

วงเล็บเหลี่ยมใช้กำหนด ชุด ของอักขระที่ต้องการจับคู่:

[aeiou]     — สระใดก็ได้
[A-Z]       — ตัวอักษรพิมพ์ใหญ่ใดก็ได้
[0-9a-f]    — ตัวเลข hex ใดก็ได้
[^0-9]      — อะไรก็ได้ที่ไม่ใช่ตัวเลข

Groups และ alternation

วงเล็บใช้ จัดกลุ่ม ส่วนต่างๆ ของ pattern และ | หมายถึง "หรือ":

(cat|dog)s?   — จับคู่ cat, cats, dog, dogs
(\d{3})-(\d{4}) — จับคู่ 555-1234 และดึงแต่ละส่วนออกมา

Captured groups มีประโยชน์สำหรับการ ดึงข้อมูล (extraction) — เช่น หมายเลขโทรศัพท์, วันที่, หรือ IDs จากข้อความที่ยุ่งเหยิง

รูปแบบที่ใช้งานจริงทั่วไป

Email (แบบย่อ)

^[^\s@]+@[^\s@]+\.[^\s@]+$

ตรวจสอบในรูปแบบ "บางอย่าง @ บางอย่าง . บางอย่าง" — เพียงพอสำหรับการตรวจสอบฝั่ง client สำหรับ production ควรยืนยันด้วยการตรวจสอบการส่ง email จริงโดยใช้ Email Validator ของเรา

URL

https?:\/\/[^\s/$.?#].[^\s]*

จับคู่ทั้ง URL แบบ http และ https สำหรับการสร้าง URL ที่ถูกต้อง ดูได้ที่ URL & Query String Builder

หมายเลขโทรศัพท์ (US)

\(?\d{3}\)?[-.\s]?\d{3}[-.\s]?\d{4}

จับคู่รูปแบบเช่น (555) 123-4567, 555.123.4567, และ 555-123-4567

วันที่ (YYYY-MM-DD)

\d{4}-(0[1-9]|1[0-2])-(0[1-9]|[12]\d|3[01])

การ debug regex

วิธีที่ดีที่สุดในการเรียนรู้คือการ ทดสอบแบบโต้ตอบ วาง pattern และ string ตัวอย่างลงใน Regex Tester ของเรา — มันจะไฮไลต์การจับคู่แบบ real-time, แสดง captured groups, และอธิบายว่าแต่ละส่วนของ pattern ทำงานอย่างไร

เขียน pattern ที่ง่ายที่สุดที่แก้ปัญหาของคุณได้ regex ที่ "ฉลาดเกินไป" จะดูแลรักษาได้ยาก

ปัญหาด้านประสิทธิภาพ

Catastrophic backtracking

Quantifiers ซ้อนกัน เช่น (a+)+b อาจทำให้ engine ต้องลองเส้นทางจำนวนมหาศาลแบบ exponential เมื่อ input ไม่ตรงกัน หลีกเลี่ยง pattern ที่อักขระเดียวกันสามารถจับคู่ได้โดยหลายส่วนของ expression

การใช้ Anchoring ช่วยประหยัดเวลา

ถ้าคุณรู้ว่า pattern ควรจับคู่กับ string ทั้งหมด ให้ใช้ ^ และ $ หากไม่มี anchors engine จะสแกนทุกตำแหน่งใน string เพื่อหาการจับคู่บางส่วน

Quick reference cheat sheet

.           อักขระใดก็ได้
\d \D       ตัวเลข / ไม่ใช่ตัวเลข
\w \W       อักขระคำ / ไม่ใช่อักขระคำ
\s \S       whitespace / ไม่ใช่ whitespace
[abc]       character set
[^abc]      negated set
(group)     capturing group
(?:group)   non-capturing group
a{3}        ครบ 3 ครั้งพอดี
a{2,5}      ระหว่าง 2 ถึง 5 ครั้ง
a*? a+?     lazy (non-greedy) versions
(?=ahead)   positive lookahead
(?!ahead)   negative lookahead

Regex เป็นทักษะที่สะสมได้ เริ่มจาก pattern ง่ายๆ, ทดสอบแบบมองเห็น, และเพิ่มความซับซ้อนเมื่อจำเป็นเท่านั้น ทุกภาษาโปรแกรมรองรับ regex — เมื่อคุณเรียนรู้ syntax แล้ว ก็สามารถนำไปใช้ได้ทุกที่