วิธีทำ
วิธีทดสอบ regex โดยไม่ต้องติดตั้งอะไรเลย
คุณเขียนรูปแบบขึ้นมาแล้วและต้องรู้ว่ามันตรงกับสิ่งที่คุณคาดหวังจริงหรือไม่ ก่อนจะนำไปใส่ในโค้ด การติดตั้งเครื่องมือบนเดสก์ท็อปหรือแปะล็อกส่วนตัวลงในเว็บไซต์สุ่ม ๆ นั้นเกินจำเป็นและมักเสี่ยง คู่มือนี้แสดงวิธีรัน regex กับข้อความของคุณเองในเบราว์เซอร์ทันที สลับแฟล็กที่เปลี่ยนพฤติกรรม อ่านกลุ่มจับที่ดึงออกมา และดูการจับคู่ไฮไลต์ในบรรทัด โดยที่ทั้งรูปแบบและข้อความไม่เคยออกจากแท็บของคุณ
ทีละขั้นตอน
- เปิดเครื่องมือทดสอบ regex แล้วพิมพ์รูปแบบของคุณในช่องที่อยู่ระหว่างเครื่องหมายทับสองอัน คุณไม่ต้องพิมพ์เครื่องหมายทับเอง เครื่องมือจะแสดงให้เห็นเพื่อให้คุณเห็นรูปแบบในแบบที่เอนจินอ่าน วางข้อความตัวอย่างของคุณลงในกล่องด้านล่าง เช่น บรรทัดล็อกสองสามบรรทัด รายชื่ออีเมล หรือบล็อกโค้ดที่คุณต้องการค้นหา
- ตั้งค่าแฟล็กในกล่องเล็ก ๆ ที่อยู่ข้างรูปแบบ แฟล็ก g จะค้นหาทุกการจับคู่แทนที่จะหยุดที่ตัวแรก, i ทำให้การจับคู่ไม่สนใจตัวพิมพ์เล็กพิมพ์ใหญ่, m ทำให้ตัวยึด ^ และ $ ตรงกับจุดเริ่มต้นและจุดสิ้นสุดของแต่ละบรรทัดแทนที่จะเป็นข้อความทั้งหมด, s ทำให้จุดตรงกับการขึ้นบรรทัดใหม่ด้วย คุณรวมแฟล็กได้อย่างอิสระ เช่น gim
- กดทดสอบ การจับคู่แต่ละครั้งจะถูกไฮไลต์โดยตรงในข้อความของคุณ และรายการด้านล่างจะแสดงทุกการจับคู่พร้อมตำแหน่งและค่าของแต่ละกลุ่มจับ ปรับรูปแบบแล้วรันอีกครั้ง ตัวอย่างจะอัปเดตเพื่อให้คุณค่อย ๆ จำกัดรูปแบบจนจับได้ตรงกับสิ่งที่คุณตั้งใจพอดีและไม่มีอย่างอื่นปน
กลุ่มจับ ทั้งแบบตั้งชื่อและแบบใส่หมายเลข
กลุ่มจับคือส่วนของรูปแบบที่อยู่ในวงเล็บ และเป็นวิธีที่คุณดึงชิ้นส่วนออกจากการจับคู่แต่ละครั้ง แทนที่จะแค่ยืนยันว่าทั้งหมดตรงกัน กลุ่มที่ใส่หมายเลขจะนับจากซ้ายไปขวาตามวงเล็บเปิด ใน (\d{4})-(\d{2})-(\d{2}) กลุ่ม 1 คือปี กลุ่ม 2 คือเดือน กลุ่ม 3 คือวัน กลุ่มที่ตั้งชื่อใช้ไวยากรณ์ (?<name>...) ดังนั้น (?<year>\d{4}) จึงอ่านเข้าใจง่ายกว่าตัวเลขเปล่า ๆ มากเมื่อรูปแบบใหญ่ขึ้น หากคุณต้องการเพียงจัดกลุ่มโดยไม่จับ เช่น เพื่อใช้ตัวกำหนดจำนวนกับหลายอักขระ ให้ใช้กลุ่มที่ไม่จับ (?:...) เพื่อไม่ให้รกรายการผลลัพธ์ของคุณ เครื่องมือจะแสดงค่าของทุกกลุ่มสำหรับทุกการจับคู่ ซึ่งเป็นวิธีที่เร็วที่สุดในการยืนยันว่าคุณกำลังดึงชิ้นส่วนที่ถูกต้อง
เมื่อรูปแบบค้างหรือทำงานผิดปกติ
มีสองปัญหาที่เกิดขึ้นซ้ำ ๆ อยู่เสมอ ปัญหาแรกคือการย้อนรอยแบบหายนะ รูปแบบอย่าง (a+)+$ ที่รันกับสตริงยาว ๆ ที่ไม่ตรงกัน อาจทำให้เอนจินลองเส้นทางจำนวนมหาศาลแบบเอกซ์โพเนนเชียลจนค้าง เครื่องมือจะรันการทดสอบแต่ละครั้งใน Web Worker พร้อมตัวเฝ้าระวังเวลาสั้น ๆ ดังนั้นแทนที่จะเป็นแท็บที่ค้าง คุณจะได้ข้อความที่ชัดเจนและสามารถลดความซับซ้อนของรูปแบบได้ มักทำโดยทำให้ตัวกำหนดจำนวนมีลักษณะหวงในเชิงหลักการ ยึดมันด้วยตัวยึด หรือหลีกเลี่ยงการทำซ้ำซ้อน ปัญหาที่สองคือการจับคู่แบบโลภเทียบกับแบบขี้เกียจ โดยค่าเริ่มต้น .* จะคว้าให้มากที่สุดเท่าที่ทำได้ ดังนั้นเพื่อจับเนื้อหาภายในแท็ก HTML เดียว คุณจะต้องใช้รูปแบบขี้เกียจ .*? แทน หากคุณกำลังเปรียบเทียบสตริงสองเวอร์ชันที่ต่างกันเล็กน้อยเพื่อดูว่ารูปแบบของคุณควรเล็งไปที่อะไร เครื่องมือเทียบความต่างของข้อความจะจัดเรียงทั้งสองไว้ให้ความต่างเห็นชัดก่อนที่คุณจะเขียนนิพจน์
วิธีที่เบราว์เซอร์ประเมิน regex ของคุณ
เบราว์เซอร์สมัยใหม่มี ECMAScript regex engine ในตัวที่รองรับ flag set เต็ม: case-insensitive matching (i), multiline mode (m), dotAll (s), Unicode (u) และ sticky flag (y) เมื่อคุณพิมพ์ pattern ใน tester engine จะคอมไพล์เป็น internal NFA และประเมินกับ test string ของคุณแบบ real-time รายงาน match position ทุกตำแหน่งและ capture group ใด Backtracking เกิดขึ้นในเครื่องบน CPU ของคุณ: pattern อย่าง (a+)+ บนสตริงที่ไม่ match ยาวอาจหมุนอยู่หลายวินาที และการเห็นการหยุดชะงักนั้นในเบราว์เซอร์เป็น feedback ที่มีประโยชน์ก่อน deploy pattern ในโค้ด production ไม่มีข้อความออกจากหน้า ดังนั้นคุณสามารถวาง log sample หรือ input ใดก็ได้โดยไม่ต้องส่งผ่านเซิร์ฟเวอร์ third-party
เครื่องมือที่ใช้ในคู่มือนี้
คำถามที่พบบ่อย
รูปแบบหรือข้อความทดสอบของฉันถูกส่งไปยังเซิร์ฟเวอร์หรือไม่?
ไม่ regex ทำงานภายใน Web Worker ในเบราว์เซอร์ของคุณเอง ดังนั้นรูปแบบและข้อความที่คุณใช้ทดสอบจึงอยู่ในแท็บ เรื่องนี้สำคัญเพราะข้อความที่คุณวางมักเป็นล็อกจริง รายชื่อลูกค้า หรือคอนฟิกภายใน ซึ่งเป็นข้อมูลประเภทที่คุณไม่อยากให้อยู่บนเซิร์ฟเวอร์ของคนอื่น เปิดแผงเครือข่ายในเครื่องมือสำหรับนักพัฒนาขณะที่คุณกดทดสอบ แล้วคุณจะไม่เห็นคำขอใดที่นำข้อความของคุณออกไป อีกทั้งยังทำงานต่อได้แบบออฟไลน์เมื่อโหลดหน้าเสร็จแล้ว
เครื่องมือนี้ใช้ regex สำเนียงไหน?
มันใช้เอนจินนิพจน์ปกติของ JavaScript ที่ฝังอยู่ในเบราว์เซอร์ของคุณ ตัวเดียวกับที่รันใน Node.js และในหน้าเว็บใด ๆ ซึ่งครอบคลุมไวยากรณ์ทั่วไป ได้แก่ คลาสอักขระ ตัวกำหนดจำนวน ตัวยึด การสลับ กลุ่มจับแบบใส่หมายเลขและแบบตั้งชื่อ การมองไปข้างหน้าและการมองไปข้างหลัง คุณสมบัติบางอย่างจากสำเนียงอื่น เช่น การเรียกซ้ำสไตล์ Perl หรือตัวกำหนดจำนวนแบบหวง ไม่ได้เป็นส่วนหนึ่งของเอนจิน JavaScript ดังนั้นหากรูปแบบที่คุณคัดลอกมาจากโปรเจกต์ PHP หรือ Python ทำงานต่างออกไป ความต่างของสำเนียงนั้นมักเป็นสาเหตุ