กลุ่มจับในเมธอด replace ของ Regular Expression ใน JavaScript

เมื่อทำงานกับเมธอด replace หาก เราใส่บางอย่างลงในกลุ่มจับใน regex ในสตริงที่ใช้แทนที่ เราสามารถแทรกเนื้อหาของ กลุ่มจับนั้นได้โดยเขียนเครื่องหมายดอลลาร์ $ และหมายเลขกลุ่มจับ ตัวอย่างเช่น $1 - กลุ่มจับแรก $2 - กลุ่มจับที่สอง และต่อไปเรื่อยๆ

มาดูตัวอย่างกันว่าทำไมถึงต้องใช้และจะใช้สิ่งนี้อย่างไร

ตัวอย่าง

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

javascriptlet str = '1 23 456 xax';
let res = str.replace(/(\d+)/g, '($1)');

ผลลัพธ์ที่ได้ในตัวแปรจะเป็นดังนี้:

javascript'(1) (23) (456) xax'

ตัวอย่าง

มาหาสตริงทั้งหมดที่แสดงถึง ตัวเลขที่มี 'x' ล้อมรอบ และแทนที่ตัวเลขเหล่านี้ ด้วยตัวมันเอง แต่มีเครื่องหมาย '!' ล้อมรอบ:

javascriptlet str = 'x1x x23x x456x xax';
let res = str.replace(/x(\d+)x/g, '!$1!');

ผลลัพธ์ที่ได้ในตัวแปรจะเป็นดังนี้:

javascript'!1! !23! !456! xax'

ตัวอย่าง

มาลองแก้ปัญหาต่อไปนี้: มีสตริง รูปแบบ 'aaa@bbb' - ตัวอักษร แล้วตามด้วย @ แล้วตามด้วยตัวอักษร จำเป็นต้องสลับตำแหน่งตัวอักษร ก่อน @ และหลัง

javascriptlet str = 'aaa@bbb ccc@ddd';
let res = str.replace(/([a-z]+)@([a-z]+)/g, '$2@$1');

ผลลัพธ์ที่ได้ในตัวแปรจะเป็นดังนี้:

javascript'bbb@aaa ddd@ccc'

โจทย์ปฏิบัติ

javascriptlet str = '12 34 56 78';

javascriptlet str = '31.12.2025';