ES2018 – ביטויי lookBehind ו-lookAhead בביטויים רגולריים

כפי שציינתיגם במאמר הקודם, ל-ES2018 יש כמה תוספות חשובות ביותר לתחום ה-regular expression (שזה, תאמינו או לא, נקרא ביטויים רגולריים) – שתי תוספות ממש חמודות נקראות lookBehind ו-lookAhead.

lookAhead בעצם תופס לי ביטוי רגולרי על פי מה שיש אחריו. מה זאת אומרת? נניח ואני רוצה שהמחרוזת תעבור כל עוד יש בה את המילה foo שיש אחריה מיד את המילה bar. אבל בלי לתפוס את ה-bar. איך אני אעשה את זה? עם הביטוי הזה:

const REGEX = /foo(?=bar)/

סוגריים עם סימן שאלה ואז שווה אומרים – ׳הדבר שבא אחרי מה שבא מקודם׳. במקרה שלנו foo בא קודם ו- bar בא אחר כך.

const REGEX = /foo(?=bar)/

const a = REGEX.test('foobar'); // true

const b = REGEX.test('fooba'); // false

עוד דוגמה? בוודאי שכן! הנה. בואו נניח שאני מקבל מספר טלפון ואני רוצה את הקידומת בלבד. להזכירכם, lookAhead לא תופס את מה שבא אחריו. אז אני יכול בקלות להשתמש בביטוי של כל מספר שיש אחריו ׳-׳. איך עושים את זה? בקלות! קודם כל הביטוי הרגולרי הוא:

+[0-9]
שזה אומר כל ספרה אחת ויותר
(-\=?)
שזה אומר שחייב שיהיה אחריו מקף. שימו לב שהמקף הוא אחרי \.

וכך זה נראה בחיים האמיתיים:

const REGEX = /[0-9]+(?=\-)/

const a = ('054-45757575').match(REGEX); // 054

וזה תפס את ה-054 בלבד. הייתי יכול להתמש בדרך אחרת – אבל בשביל לתפוס את הקידומת בלבד הייתי צריך להשתמש בקבוצות וכאן אני יכול להשתמש בביטוי רגולרי אחד ויחיד על מנת לתפוס משהו.

זהו lookBehind חיובי. כלומר אני חייב שזה יופיע אחרי הביטוי. אם אני רוצה, אני יכול להשתמש ב-lookBehind שלילי – כלומר הביטוי לא יתפוס אם הביטוי שאציין ב-lookBehind יופיע. איך עושים את זה? בקלות! במקום ה-׳=׳ משתמשים ב-׳!׳. זה הכל! הנה – תראו את הדוגמה של ה-foobar – איך אני הופך אותה. מעכשיו הביטוי הרגולרי לא יתפוס אם אחרי ה-foo יש bar.

const REGEX = /foo(?!bar)/

const a = REGEX.test('foobar'); // false

const b = REGEX.test('fooba'); // true

אם אנחנו רוצים דוגמה נוספת, אז כך למשל אני תופס את השם הפרטי של כל האנשים ששם המשפחה שלהם הוא לא כהן.

const REGEX = /\S+ (?!Cohen)/

const a = 'Haim Levi'.match(REGEX); //Haim

const b = 'Moshe Cohen'.match(REGEX); //Null

אם אתם רוצים להשתשעש – הנה ה-codepen.

See the Pen positive and negative lookAhead by Ran Bar-Zik (@barzik) on CodePen.

בדיוק כפי שיש לנו lookAhead שבוחן מה מתרחש מיד אחרי הביטוי שלנו (אבל תופס רק את הביטוי) יש לנו גם lookBehind שבודק מה קורה לפני הביטוי שלנו (אבל תופס רק את הביטוי. דוגמה? אני מקבל מחרוזת טקסט, אני לא רוצה את הקידומת אלא רק את המספר. איך עושים את זה? פשוט מאוד. אני יוצא מנקודת הנחה שאני רוצה את כל מה שיש לפניו מספר ומקף (כמו למשל -03 או -054). איך עושים את זה? בקלילות:

const REGEX_POSTIVE = /(?< =\-)\d+/

const c = '03-6382020'.match(REGEX_POSTIVE); //6382020

const d = '054-5555555'.match(REGEX_POSTIVE); //5555555

זה בדיוק כמו lookAhead אבל יש גם > לפני ה-=. זה הכל! ויש לנו גם negative lookbehind. למשל, כאן אני בודק אם יש מספר שלפניו אין הסימן דולר.

const REGEX_NEGATIVE = /(?< !$)\d/

const e = '$4'.match(REGEX_NEGATIVE); //false

const f = '₪4'.match(REGEX_NEGATIVE); // 4

איך זה עובד? פשוט. באמת שכן - הביטוי
!>?
הוא ה-lookbehind השלילי. מיד אחריו אני שם את הביטוי שאני לא רוצה שייכנס. במקרה הזה $. לא נשכח את ה-\ לפניו כי זה תו מיוחד ולהקיף את הכל בסוגריים. אחרי זה אני פשוט שם d\ שאומר מספר. זה הכל.

See the Pen positive and negative Lookbehind by Ran Bar-Zik (@barzik) on CodePen.

אני יודע שביטויים רגולריים יכולים להיות מעצבנים לפרקים, אבל הם ממש שימושיים וטוב ש-lookbehind ו-lookahead סוף סוף נכנסו לתקן החדש.