Dezvoltatorii folosesc editorii de text de mult timp. Și, ca majoritatea instrumentelor, toți editorii de text au o caracteristică comună: găsirea și înlocuirea.

Dacă ați folosit pentru a găsi și înlocui de ceva timp, este posibil să știți cât de utilă este această caracteristică. Dar majoritatea dintre noi nu știm că acest instrument este chiar mai puternic decât ne dăm seama.

Nu poate înlocui doar șirurile simple, ci și modelele. Aceste tipare sunt cunoscute sub numele de Expresii obisnuite.

Expresiile regulate există în JavaScript și în majoritatea celorlalte limbaje de programare. Regex (pe scurt) sunt un instrument foarte puternic care vă ajută să găsiți modele de căutare simple, precum și complexe.

Algoritmii de căutare a șirurilor sunt, de asemenea, o ramură semnificativă a informaticii. În acest articol vom învăța cum să folosim acest instrument uimitor în JavaScript.

De ce expresii regulate?

Nu veți înțelege importanța reală a expresiilor regulate până când nu vi se va oferi un document lung și vi se va cere să extrageți toate e-mailurile din acesta.

Puteți face asta manual, dar există o metodă foarte rapidă care o poate face pentru dvs. Majoritatea editorilor de text moderni permit Regex în opțiunea Găsire. De obicei este notat cu .*.

Exemplu de potrivire regex JavaScript Cum se foloseste JS
Extragerea e-mailurilor folosind Regex

Și asta nu este tot ce poate face regex – e-mailurile sunt doar un exemplu. Puteți căuta orice tip de șir care urmează un model, de exemplu, adrese URL sau text între paranteze.

Regex poate fi, de asemenea, utilizat pentru a valida anumite tipuri de modele, cum ar fi validarea e-mailului. Ați putea înlocui o logică lungă de validare ca aceasta:

function IsValidEmail(email) {
        if (email.length <= 2) {
            return false;
        }

        if (email.indexOf("@") == -1) {
            return false;
        }
 
        var parts = email.split("@");
        var dot = parts[1].indexOf(".");
        var len = parts[1].length;
        var dotSplits = parts[1].split(".");
        var dotCount = dotSplits.length - 1;
    
        if (dot == -1 || dot < 2 || dotCount > 2) {
            return false;
        }

        for (var i = 0; i < dotSplits.length; i++) {
            if (dotSplits[i].length == 0) {
                return false;
            }
        }
 
        return true;
    };

Cu o singură linie ca aceasta:

function isValidEmail(email) {
   return /^(([^<>()[]\.,;:s@"]+(.[^<>()[]\.,;:s@"]+)*)|(".+"))@(([[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}])|(([a-zA-Z-0-9]+.)+[a-zA-Z]{2,}))$/.test(email);
}

Deși expresia regulată pare înfricoșătoare, nu trebuie să vă amintiți. Odată ce ați înțeles cum funcționează, va fi foarte simplu de implementat.

JavaScript Regex Match

În JavaScript, avem o metodă de potrivire pentru șiruri. Această metodă poate fi utilizată pentru a potrivi Regex într-un șir.

Această metodă este aceeași cu metoda de găsire în editorii de text. Se caută un șir dat cu un Regex și returnează o serie de toate meciurile. Prototipul metodei de potrivire este după cum urmează:

str.match(regexp)

Aceasta va returna o serie de toate potrivirile pe șirul de căutare (str) pentru expresie regulată (regexp).

O utilizare de bază a acestei metode ar fi să numărăm toate cuvintele dintr-un șir. De exemplu:

var str = "This is a test string";

var matchArr = str.match(/w+/g);

console.log(matchArr.length);    //prints 5

Vom afla despre asta w+ expresie regulată mai târziu în acest articol.

Folosind astfel de expresii regulate, putem îndeplini diverse sarcini care altfel ne-ar impune să scriem logica plictisitoare. Un exemplu a fost funcția de validare a e-mailurilor. Trebuie să testăm toate criteriile, dar folosind regex îl puteți simplifica.

Expresiile regulate sunt valabile în majoritatea funcțiilor șir, dar ar trebui să verificați prototipul funcției dacă doriți să fiți sigur. O astfel de metodă este metoda Înlocuire. Să aflăm mai multe despre el mai jos.

JavaScript Metoda de înlocuire

JavaScript are o serie de funcții utilitare șir. Înlocuirea este una dintre ele. Prototipul metodei de înlocuire este după cum urmează:

const newStr = str.replace(regexp|substr, newSubstr|function)

După cum puteți vedea, metoda de înlocuire acționează asupra unui șir și returnează un șir. Este nevoie de doi parametri: șirul care trebuie înlocuit și cu ce va fi înlocuit.

Primul parametru poate fi un șir sau o expresie regulată. Aici putem folosi puterea expresiilor regulate pentru a înlocui modele complexe de căutare cu un șir.

Al doilea parametru ar putea fi, de asemenea, o funcție. Pentru a o demonstra, să verificăm un exemplu:

var str = "This is a test string";

var newStr = str.replace(/w+/g, function(match) {
 return match.split("").reverse().join("");
});

console.log(newStr);    //prints "sihT si a tset gnirts"

Acest exemplu inversează fiecare cuvânt dintr-un șir. Deci, după cum puteți vedea, înlocuirea combinată cu regex este un instrument foarte puternic în JavaScript.

Metoda de înlocuire poate fi utilă dacă doriți să înlocuiți un anumit model de căutare cu un alt șir după o procesare a șirului original.

Poate fi folosit și pentru a corecta o potrivire nevalidă – de exemplu pentru a valida e-mailurile și, dacă este posibil, pentru a corecta e-mailurile nevalide.

Acum, că știm cât de util este Regex, să învățăm câteva expresii regulate de bază și să căutăm șiruri.

Expresii regulate de bază

Deși expresiile regulate sunt un subiect vast, cele de bază sunt foarte ușor de înțeles și de reținut. Să încercăm să înțelegem câțiva termeni de bază asociați cu expresiile regulate.

Litere

A literal este orice caracter care este evaluat ca el însuși și nu sub nicio formă generală. Prin urmare, word este, de asemenea, o expresie regulată valabilă, care se va potrivi numai “cuvânt”.

Dacă doriți să înlocuiți toate instanțele unui anumit cuvânt în JavaScript, puteți face acest lucru:

var str = "JavaScript is a very popular programming language. javascript is used in web developement. javascript is very easy to learn.";

var newStr = str.replace(/javascript/gi,"js");

console.log(newStr);

/* prints "js is a very popular programming language. js is used in web developement. js is very easy to learn." */

Aceasta înlocuiește toate aparițiile JavaScript cu JS. Am realizat acest lucru folosind g identificator, care înseamnă căutare globală. Adică, caută toate aparițiile mai degrabă decât doar prima.

Există, de asemenea, un i identificator. Reprezintă căutarea care nu distinge majuscule și minuscule. Se potrivește șirului ignorând carcasa.

Astfel, un literal poate fi folosit pentru a se potrivi cu un anumit caracter sau grup de caractere.

Meta-caractere

A meta-caracter este utilizat pentru căutarea generică, cum ar fi pentru a căuta orice cifră, orice caracter sau orice caracter alfanumeric. Acestea sunt câteva meta-caractere comune:

  • d se potrivește cu orice cifră, adică cifre de la 0 la 9
  • w se potrivește cu orice caracter alfanumeric, adică alfabetele az, AZ și cifrele 0-9.
  • s se potrivește cu orice spațiu alb

În mod similar, D , W și S potriviți orice caractere fără cifre, nealfanumerice și, respectiv, fără spații albe. De exemplu, ddd ar corespunde oricăror trei cifre la rând.

Cuantificatoare

A cuantificator este folosit pentru a cuantifica orice literal sau meta-caracter. Poate fi folosit pentru a selecta mai multe apariții ale unui caracter dat. Există patru tipuri de cuantificatori definiți în regex:

  • * este folosit pentru a potrivi 0 sau mai multe apariții ale unui caracter dat.
  • + este folosit pentru a potrivi 1 sau mai multe apariții ale unui caracter dat.
  • . este folosit pentru a se potrivi fie fără apariție, fie cu 1 apariție a unui caracter dat.
  • {min,max} sau {n} poate fi folosit pentru a potrivi un număr de apariții într-un interval sau un număr dat de ori n

Un exemplu ar fi cel pe care l-am folosit mai sus pentru a inversa fiecare cuvânt dintr-un șir.

  • w+ se potrivește cu fiecare cuvânt dintr-un șir
  • w se potrivește cu orice caracter alfanumeric
  • w+ se potrivește cu una sau mai multe apariții ale unui caracter alfanumeric, adică cu fiecare cuvânt dintr-un șir.

Am putea folosi, de asemenea, cuantificatoare pentru a înlocui mai multe spații albe cu un singur spațiu alb. De exemplu:

var str = "This  is   a    string with  multiple       whitespaces";

var newStr = str.replace(/ss+/g, " ");

console.log(newStr);    //prints "This is a string with multiple whitespaces"

Există o mulțime de alte utilizări pentru cuantificatori.

Poziționează meta-caractere

Există, de asemenea poziționează meta-caractere care reprezintă o poziție. De exemplu ^ reprezintă începutul unei linii, $ reprezintă sfârșitul unei linii și b reprezintă granițele cuvintelor.

Concluzie

În acest articol, am aflat cât de importante sunt expresiile regulate. De asemenea, am văzut cum pot fi folosite pentru căutarea unor modele de căutare simple și complexe.

Acest lucru are un mare potențial în programarea cu text. Algoritmii de potrivire a șirurilor sunt utilizați în potrivirea ADN și formează o ramură semnificativă a informaticii.

Odată ce stăpânești regexul, îl poți folosi cu potrivirea JavaScript și înlocuiește metodele pentru a simplifica programele lungi și a-l utiliza pentru validarea anumitor tipare. Regex vă poate ajuta, de asemenea, să scurtați programele lungi și să le faceți mai ușor de înțeles.

Acum îți poți folosi propria creativitate și poți face regex minunat – deci noroc cu noua ta abilitate.

Aceasta a fost o imagine de ansamblu foarte simplă a expresiilor regulate. Dacă doriți să stăpâniți arta regexului, vă sugerez să verificați Tutorialul lui Daniel Shiffman aici.

Hei, sper că ți-a plăcut acest articol și am învățat ceva. Mă găsești la mine acasă, theabbie.github.io sau a mea Github. Verifică din celelalte articole ale mele. Mulțumesc.