Positiv og negativ lookahead i JavaScript regex

Noen ganger må man løse en oppgave av denne typen: finn strengen 'aaa' og erstatt den med '!', men bare hvis det etter 'aaa' står 'x', mens 'x' i seg selv ikke skal erstattes. Hvis vi prøver å løse oppgaven 'direkte', vil det ikke lykkes:

'aaax baaa'.replace(/aaax/g, '!'); // returnerer '! baaa', men vi ønsket '!x baaa'

Lookahead

For å løse oppgaven trengs en måte å si at 'x' ikke skal erstattes. Dette gjøres ved hjelp av spesielle parenteser (?= ), som bare ser, men ikke tar med seg.

Disse parentesene kalles positiv lookahead. Positiv - fordi 'x' (i vårt tilfelle) må være til stede - bare da vil erstatting skje.

La oss bruke disse parentesene for å løse vår oppgave:

'aaax aaab'.replace(/aaa(?=x)/g, '!'); // returnerer '!x aaab'

Det finnes også negativ lookahead - (?! ) - den sier, tvert imot, at noe ikke skal være til stede. I det følgende eksempelet vil erstatting skje bare hvis det etter 'aaa' står IKKE 'x':

'aaax aaab'.replace(/aaa(?!x)/g, '!'); // returnerer 'aaax !b'

Lookbehind

På samme måte finnes positiv lookbehind - (?<= ). I det følgende eksempelet vil erstatting skje bare hvis det foran 'aaa' står 'x':

'xaaa'.replace(/(?<=x)aaa/g, '!'); // returnerer 'x!'

Og det finnes også negativ lookbehind - (?<! ). I det følgende eksempelet vil erstatting skje bare hvis det foran 'aaa' ikke står 'x':

'baaa'.replace(/(?<!x)aaa/g, '!'); // returnerer 'b!'

Praktiske oppgaver

Gitt en streng som inneholder funksjonsnavn:

let str = 'func1() func2() func3()';

Få en array med funksjonsnavn fra strengen.

Gitt en streng med en tag:

let str = '<a href="" class="eee" id="zzz">';

Få en array med attributtnavn for denne taggen.

Gitt en streng med variabler:

let str = '$aaa $bbb $ccc xxxx';

Få delstrengene som kommer etter dollartegnet.