nl.hideout-lastation.com
Paradijs Voor Ontwerpers En Ontwikkelaars


Beginnersgids voor reguliere expressie (Regex)

Een reguliere expressie is een set tekens die een patroon vormen dat in een string kan worden doorzocht. Regex kan worden gebruikt voor validatie, zoals het valideren van creditcardnummers, voor zoeken, dwz via complexe tekstovereenkomsten, en voor het vervangen van aangepaste tekst door een andere tekenreeks. Het heeft ook geweldige ondersteuning voor meerdere talen - leer het een keer en je kunt het in vele programmeertalen gebruiken.

Ik heb gezien dat weinig mensen een eerste blik werpen op regex en het volledig negeren. Ik neem het hen niet kwalijk; De syntaxis van regex is complex en zorgt ervoor dat er veel gekriebel ontstaat, net als die opdrachtregeltalen, alleen erger. Maar dan is elk nieuw iets eng en lijkt het aanvankelijk onmogelijk om te leren. Dus, als ik Horatius 'woorden leen, zal ik dit zeggen; Begin, wees moedig en waag het om wijs te zijn .

Over Regex

Regex had zijn wortels in neurowetenschap en wiskunde en werd pas in 1968 geïmplementeerd door Ken Thompson in QED-teksteditor voor tekstonderzoek. Nu is het onderdeel van veel programmeertalen zoals Perl, Java, Python, Ruby en JavaScript.

Laten we eens kijken naar enkele voorbeelden van hoe regex werkt.

Ik zal JavaScript in mijn voorbeelden gebruiken. Om nu het beginnersniveau te halen, moet je alle karakters, klassen, kwantoren, modifiers en methoden leren die in regex worden gebruikt. Hier is een link naar de pagina Reguliere expressie van Mozilla Developer Network, waar je een tabel kunt bekijken met al deze. Je kunt ook de cheatsheet aan het einde van dit bericht met de meeste gebruikte karakters raadplegen.

Laten we een eenvoudig voorbeeld bekijken met een uitleg. Dit is een regex.

Dit is waar de bovenstaande regex naar zal kijken in een regel, een karakter 'B' gevolgd door tenminste één van elk teken tussen (en inclusief) 'a' naar 'z', 'A' naar 'Z' en getallen 0 naar 9.

Hier is een voorbeeld van wedstrijden in een gemarkeerde regel:

Mand bol B12 vitamine, BaSO4 , N BC bedrijf

De bovenstaande regex stopt het zoeken op Mand en retourneer een positieve reactie. Dat komt omdat de globale modifier ' g ' moet worden opgegeven als u wilt dat de regex alle mogelijke overeenkomsten bekijkt.

Laten we nu kijken hoe we deze expressie in JavaScript kunnen gebruiken. De test is: als een gevonden overeenkomst wordt gevonden, wordt false geretourneerd, anders false .

 var input = "uw test string", regex = / B [a-zA-Z \ d] + /; if (! regex.test (input)) alert ('Geen overeenkomst gevonden'); else alert ('Er is een overeenkomst gevonden'); 

Laten we een andere methode proberen: match retourneert de overeenkomsten gevonden in een array.

 var input = "jouw test string", regex = / B [a-zA-Z \ d] + / g, / * Ik heb de globale modifier 'g' toegevoegd aan de regex om alle matches te krijgen * / ary = input.match (regex); if (ary === null) alert ('Geen overeenkomst gevonden'); else alert ('matches zijn:' + ary.toString ()); 

Hoe zit het met string replace ? Laten we dat nu met regex proberen.

 var input = "your test string", regex = / B [a-zA-Z \ d] + / g; alert (input.replace (regex, "#")); 

Hieronder is een codepen om in te stellen. Klik op het tabblad "JavaScript" om de JS-code te bekijken.

Oefeningen

Voor oefeningen kun je "regex-oefeningen" googelen en proberen ze op te lossen. Dit is wat je kunt verwachten bij het proberen van deze oefeningen, afhankelijk van de moeilijkheidsniveaus.

basis-

Voor mij is het voldoende om een paswoord te kunnen valideren . Dus, valideer een wachtwoord van 8 tot 16 tekens lang, alfanumeriek met je speciale tekens toegestaan.

tussen-

Dit is waar je moet oefenen met meer real-world data en meer regex-punten zoals lookahead, lookbehind-assertions en matching-groepen leert ;

  • Valideer pincodes, hexadecimalen, datums, e-mail-ID, zwevend punt.
  • Vervang achterliggende nul, witruimten, een reeks overeenkomende woorden
  • Extracteer verschillende delen van een URL

gevorderd

Je kunt de oplossingen van de bovenstaande oefeningen optimaliseren - de meest optimale regex voor e-mail bevat duizenden tekens - dus ga zo ver als je je prettig voelt en dat is genoeg . Je kunt ook proberen:

  • HTML of XML parseren (hoewel het in de echte wereld ontmoedigd is dit te doen, omdat het gebruik van reguliere expressie om niet-reguliere taal zoals HTML te parsen het nooit onfeilbaar maakt.) Plus XML-parsering is een moeilijke taak, geschikter voor gebruikers op gevorderd niveau)
  • Tags vervangen
  • Reacties verwijderen (behalve de voorwaardelijke opmerkingen van IE)

Gereedschap

Hulpprogramma's voor het visualiseren van regex zijn een van de coolste dingen die er zijn voor mij. Als je ooit een lange complexe regex tegenkomt, kopieer ze dan gewoon in een van die tools en je zult de flow duidelijk kunnen zien. Daarnaast zijn er veel tools die je kunt gebruiken om met de regex-code te spelen. Ze presenteren ook voorbeelden en cheatsheets samen met deelfuncties.

  • Debuggex - Het tekent een regex-diagram op basis van uw invoer en u kunt snel een aandeel delen naar StackOverflow vanaf daar.
  • RegExr - Je kunt je regex met deze testen. Het kreeg ook een referentie, een cheatsheet en voorbeelden om je te helpen.
  • Refiddle - Op dit moment kunt u, behalve JavaScript, ook ruzie maken met Ruby- en .NET-versies van regex erin.

Regex Cheatsheet

blijkDefinitie
[abc]Elk willekeurig teken a, b of c
[^ Abc]Elk ander teken dan a, b of c
[Az]Karakter tussen (inclusief) a tot z
[^ Az]Teken behalve van a tot z
[AZ]Karakter tussen (inclusief) A tot Z
.Elk afzonderlijk teken
\ sElk witruimte-teken
\ SElk niet-spatie karakters
\ dElk cijfer van 0 tot 9
\ DAlle niet-cijfers
\ wElk woordteken (letter, cijfer en onderstrepingsteken)
\ wElk niet-woordteken
(...)Leg alles vast
(A | b)Komt overeen met a of b
een?Karakter a is één keer afwezig of aanwezig
een*Karakter a is meer afwezig of meer keren aanwezig
a +Karakter a is een of meerdere keren aanwezig
a {3}3 keer voorkomen van karakter a opeenvolgend
a {3}3 of meer voorkomens van karakter a opeenvolgend
a {3, 6}3 tot 6 keer voorkomen van karakter a opeenvolgend
^Begin van de string
$Einde van de string
\ bEen woordgrens. Als een teken het laatste of eerste woordteken van een woord is of Als een teken zich tussen een woord of een niet-woordteken bevindt
\ BNiet-woordgrens

Nu lezen: reguliere expressies: 30 nuttige hulpmiddelen en bronnen

Een gebruikersinterface voor switches maken met CSS Mask

Een gebruikersinterface voor switches maken met CSS Mask

Bij beeldverwerking is maskeren een techniek waarmee u een afbeelding met een andere kunt verbergen . Een masker wordt gebruikt om een ​​deel van een afbeelding doorzichtig te maken . U kunt maskeren met behulp van CSS met behulp van maskeringseigenschappen.In de post van vandaag maken we een gemaskerde afbeelding met behulp van twee PNG-afbeeldingen en CSS-maskeringstechnieken, en stellen gebruikers in staat om de twee toestanden van de afbeelding ( dag en nacht ) te behandelen met behulp van een gebruikersinterface.Van

(Technische en ontwerptips)

Bouw sneller dj's met deze Free Boilerplate-galerij

Bouw sneller dj's met deze Free Boilerplate-galerij

U hebt toegang tot honderden gratis codebibliotheken binnen handbereik . Het is niet nodig om projecten helemaal opnieuw te bouwen als u voor hulp kunt leunen op de open-sourcecommunity.Maar, hoe doorzoek je honderden bibliotheken om er een te vinden die het beste bij je past ? Dat is wat Boilrplate zo nuttig maakt

(Technische en ontwerptips)