it.hideout-lastation.com
Paradiso Per Designer E Sviluppatori


Guida per principianti all'espressione regolare (Regex)

Un'espressione regolare è un insieme di caratteri che formano un modello che può essere cercato in una stringa. Il regex può essere utilizzato per la convalida come per convalidare i numeri delle carte di credito, per la ricerca, ad es. Per mezzo di complesse corrispondenze di testo, e per sostituire il testo abbinato con un'altra stringa. Ha anche un ottimo supporto per più lingue: imparalo una volta e puoi usarlo in molti linguaggi di programmazione.

Ho visto poche persone dare una prima occhiata alla regex e ignorarla completamente. Non li biasimo; la sintassi di regex è complessa e farà molti cringe proprio come quei linguaggi a linea di comando, solo peggio. Ma poi ogni cosa nuova è spaventosa e sembra impossibile da imparare all'inizio. Quindi, prendendo in prestito le parole di Horatius, dirò questo; Inizia, sii audace e cerca di essere saggio .

Informazioni su Regex

Il regex affonda le sue radici nelle neuroscienze e nella matematica ed è stato implementato solo in programmazione nel 1968 da Ken Thompson nell'editor di testo QED per la ricerca di testo. Ora fa parte di molti linguaggi di programmazione come Perl, Java, Python, Ruby e JavaScript.

Diamo un'occhiata ad alcuni esempi su come funziona la regex.

Userò JavaScript nei miei esempi. Ora, per passare al livello principiante, è necessario imparare tutti i personaggi, le classi, i quantificatori, i modificatori e i metodi usati nella regex. Ecco un collegamento alla pagina delle espressioni regolari di Mozilla Developer Network in cui è possibile visualizzare una tabella che contiene tutti questi elementi. Puoi anche fare riferimento al cheatsheet alla fine di questo post con i caratteri più usati.

Vediamo un semplice esempio con una spiegazione. Questa è una regex.

Questo è ciò che la regex precedente cercherà in una riga, un carattere 'B' seguito da almeno uno qualsiasi dei caratteri tra (e compresi) 'a' a 'z', 'A' a 'Z' e numeri da 0 a 9.

Ecco un esempio di corrispondenze in una riga evidenziata:

Cestino , lampadina, B12 vitamina, BaSO4 , N AVANTI CRISTO azienda

La regex precedente interromperà la ricerca a Cestino e restituire una risposta positiva. Questo perché il modificatore globale ' g ' deve essere specificato se vuoi che la regex analizzi tutte le possibili corrispondenze.

Ora, vediamo come usare questa espressione in JavaScript. Il metodo di test va: se trovato un match return true, altrimenti false .

 var input = "la tua stringa di prova", regex = / B [a-zA-Z \ d] + /; se (! regex.test (input)) alert ('Nessuna corrispondenza trovata'); altro avviso ('Una corrispondenza è stata trovata'); 

Proviamo un altro metodo: match restituisce le corrispondenze trovate in un array.

 var input = "la tua stringa di prova", regex = / B [a-zA-Z \ d] + / g, / * Ho aggiunto il modificatore globale 'g' alla regex per ottenere tutte le corrispondenze * / ary = input.match (regex); se (ary === null) alert ('Nessuna corrispondenza trovata'); altro avviso ('le corrispondenze sono:' + ary.toString ()); 

Che ne dici di replace stringhe? Proviamo ora con regex.

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

Di seguito è riportato un codice da modificare. Fare clic sulla scheda "JavaScript" per visualizzare il codice JS.

esercizi

Per gli esercizi, puoi "esercizi regex" di google e provare a risolverli. Ecco cosa aspettarsi quando si provano questi esercizi, in base ai livelli di difficoltà.

Di base

Per me essere in grado di convalidare una password è sufficiente per i principianti. Quindi, convalidare una password di lunghezza compresa tra 8 e 16 caratteri, alfanumerico con la scelta di caratteri speciali consentiti.

Intermedio

È qui che dovresti esercitarti con più dati del mondo reale e imparare pochi altri punti di regex come lookahead, lookbehind assertions e matching groups ;

  • Convalida codici PIN, esadecimali, date, ID e-mail, virgola mobile.
  • Sostituisci zero finale, spazi bianchi, un insieme di parole corrispondenti
  • Estrai diverse parti di un URL

Avanzate

Puoi ottimizzare le soluzioni degli esercizi di cui sopra - la regex più ottimale per la posta elettronica contiene migliaia di caratteri - quindi prendila per quanto ti senti a tuo agio e basta . Puoi anche provare:

  • Analisi HTML o XML (anche se nel mondo reale è scoraggiato farlo perché usare l'espressione regolare per analizzare il linguaggio non regolare come HTML non lo renderà mai infallibile. Inoltre l'analisi XML è un compito difficile, più adatto per utenti di livello avanzato)
  • Sostituzione dei tag
  • Rimozione di commenti (eccetto i commenti condizionali di IE)

Utensili

Gli strumenti per visualizzare regex sono una delle cose più interessanti per me. Se ti imbatti in una lunga regex complessa, copia semplicemente incollali in uno di questi strumenti e sarai in grado di visualizzare il flusso in modo chiaro. Oltre a ciò, ci sono molti strumenti che puoi usare per giocare con il codice regex. Presentano anche esempi e cheatsheets con funzionalità di condivisione.

  • Debuggex - Disegna un diagramma regex come da input e puoi fare una rapida condivisione a StackOverflow direttamente da lì.
  • RegExr: puoi testare il tuo regex con questo. Ha anche ottenuto un riferimento, un cheatsheet ed esempi per aiutarti.
  • Refiddle - Al momento, oltre a JavaScript, puoi anche giocherellare con le versioni di regex di Ruby e .NET.

Regex Cheatsheet

GettoneDefinizione
[Abc]Qualsiasi singolo carattere a, boc
[^ Abc]Qualsiasi carattere diverso da a, b o c
[Az]Carattere tra (compreso) dalla a alla z
[^ Az]Personaggio tranne dalla A alla Z.
[AZ]Carattere tra (compresi) dalla A alla Z.
.Qualsiasi singolo personaggio
\SQualsiasi carattere di spazio bianco
\SQualsiasi carattere non di spazio bianco
\ dQualsiasi cifra da 0 a 9
\ DQualsiasi non cifra
\ wQualsiasi carattere di parola (lettera, numero e trattino basso)
\ WQualsiasi carattere non verbale
(...)Cattura tutto chiuso
(A | B)Abbina o a o b
un?Il personaggio a è assente o presente una volta
un*Il personaggio a è assente o presente più volte
un +Il carattere a è presente una o più volte
un {3}3 occorrenze di carattere a consecutivo
un {3, }3 o più occorrenze di carattere a consecutivo
a {3, 6}Da 3 a 6 occorrenze di carattere a consecutivo
^Inizio della stringa
$Fine della stringa
\ bUn limite di parole. Se un carattere è il carattere dell'ultima o della prima parola di una parola o Se un carattere si trova tra un carattere di parole o non parole
\ BLimite non parola

Ora Leggi: Espressioni regolari: 30 strumenti e risorse utili

Gboard arriverà presto ad Android

Gboard arriverà presto ad Android

Sei mesi fa Google ha lanciato Gboard, una tastiera che viene fornita con Google Search Bar, su iOS . Lasciando fuori gli utenti Android al freddo. Questo non sarà più il caso in quanto Google sta incorporando presto Gboard per dispositivi Android .Per la maggior parte, la funzione di Gboard su Android è identica a quella di iOS. G

(Consigli tecnici e di design)

YAMM3 - Costruisci Megamenu per Bootstrap 3

YAMM3 - Costruisci Megamenu per Bootstrap 3

Ci sono molti vantaggi di usabilità nell'utilizzo di megamenu su una pagina web. Con il megamenu puoi avere il pieno controllo del tuo menu . Quasi tutti gli elementi web possono essere assegnati lì. Alcune grandi aziende hanno persino applicato megamenu sul loro sito web. Amazon e Mashable per esempio.

(Consigli tecnici e di design)