การมองด้านหน้าและการมองด้านหลังใน Regular Expression ของ JavaScript

บางครั้งจำเป็นต้องแก้ปัญหาประเภทนี้: ค้นหา สตริง 'aaa' และแทนที่ด้วย '!', แต่เฉพาะเมื่อหลังจาก 'aaa' นั้นมี 'x' เท่านั้น โดยไม่ต้องแทนที่ตัว 'x' นั้นเอง หากเราพยายามแก้ปัญหา 'ตรงไปตรงมา' เราจะทำไม่สำเร็จ:

'aaax baaa'.replace(/aaax/g, '!'); // จะคืนค่า '! baaa' แต่เราต้องการ '!x baaa'

การมองด้านหน้า

เพื่อแก้ปัญหา จำเป็นต้องมีวิธีบอกว่า ไม่ควรแทนที่ 'x' ทำได้โดยใช้วงเล็บพิเศษ (?= ) ซึ่งจะทำหน้าที่เพียง "มอง" แต่ไม่ดึงส่วนนั้นไปด้วย

วงเล็บเหล่านี้เรียกว่า การมองด้านหน้าแบบบวก แบบบวก เนื่องจากต้องมี 'x' (ในกรณีของเรา) - เฉพาะตอนนั้นการแทนที่จึงจะเกิดขึ้น

ลองใช้วงเล็บเหล่านี้เพื่อแก้ปัญหาของเรา:

'aaax aaab'.replace(/aaa(?=x)/g, '!'); // จะคืนค่า '!x aaab'

นอกจากนี้ยังมี การมองด้านหน้าแบบลบ - (?! ) - ซึ่งตรงกันข้าม มันระบุว่า ต้องไม่มีบางสิ่ง ในตัวอย่างถัดไป การแทนที่จะเกิดขึ้นก็ต่อเมื่อหลังจาก 'aaa' ไม่มี 'x':

'aaax aaab'.replace(/aaa(?!x)/g, '!'); // จะคืนค่า 'aaax !b'

การมองด้านหลัง

ในทำนองเดียวกัน มี การมองด้านหลังแบบบวก - (?<= ) ในตัวอย่างถัดไป การแทนที่จะเกิดขึ้นก็ต่อเมื่อก่อนหน้า 'aaa' มี 'x':

'xaaa'.replace(/(?<=x)aaa/g, '!'); // จะคืนค่า 'x!'

และยังมี การมองด้านหลังแบบลบ - (? ในตัวอย่างถัดไป การแทนที่ จะเกิดขึ้นก็ต่อเมื่อก่อนหน้า 'aaa' ไม่มี 'x':



	'baaa'.replace(/(?<!x)aaa/g, '!'); // จะคืนค่า 'b!'


โจทย์ฝึกปฏิบัติ

	
		กำหนดสตริงที่มีชื่อฟังก์ชัน:
	
	
		let str = 'func1() func2() func3()';
	
	
		ให้ได้อาร์เรย์ของชื่อฟังก์ชันจากสตริง
	


	
		กำหนดสตริงที่มีแท็ก:
	
	
		let str = '<a href="" class="eee" id="zzz">';
	
	
		ให้ได้อาร์เรย์ของชื่อแอตทริบิวต์ของแท็กนี้
	


	
		กำหนดสตริงที่มีตัวแปร:
	
	
		let str = '$aaa $bbb $ccc xxxx';
	
	
		ให้ได้สตริงย่อยที่อยู่ก่อนหน้าเครื่องหมายดอลลาร์