|
| 1 | +# Padrões e flags |
| 2 | + |
| 3 | +Expressão regular é uma maneira poderosa de buscar e substituir dentro de uma string. |
| 4 | + |
| 5 | +Em JavaScript, expressões regulares são implementadas usando objetos de uma classe 'RegExp' embutida e integrada com strings. |
| 6 | + |
| 7 | +Observe que as expressões regulares variam entre linguagens de programação. Nesse tutorial, nos concentramos em JavaScript. Claro que há muito em comum, mas existem algumas diferenças em Perl, Ruby, PHP, etc. |
| 8 | + |
| 9 | +## Expressões regulares |
| 10 | + |
| 11 | +Uma expressão regular (também "regexp", ou apenas "reg") consiste em um *padrão* e opcionais *flags*. |
| 12 | + |
| 13 | +Existem duas sintaxes para criar um objeto de expressão regular. |
| 14 | + |
| 15 | +A sintaxe longa: |
| 16 | + |
| 17 | +```js |
| 18 | +regexp = new RegExp("padrão", "flags"); |
| 19 | +``` |
| 20 | + |
| 21 | +...E a curta, usando barras `"/"`: |
| 22 | + |
| 23 | +```js |
| 24 | +regexp = /padrão/; // sem flags |
| 25 | +regexp = /padrão/gmi; // com flags `g`, `m` e `i` (que serão detalhadas em breve) |
| 26 | +``` |
| 27 | + |
| 28 | +Barras `"/"` dizem ao JavaScript que estamos criando uma expressão regular. Elas desempenham o mesmo papel que as aspas para strings. |
| 29 | + |
| 30 | +## Uso |
| 31 | + |
| 32 | +Para buscar dentro de uma string, nós podemos usar o método [search](mdn:js/String/search). |
| 33 | + |
| 34 | +Aqui está um exemplo: |
| 35 | + |
| 36 | +```js run |
| 37 | +let str = "Eu amo JavaScript!"; // irá buscar aqui |
| 38 | + |
| 39 | +let regexp = /amo/; |
| 40 | +alert( str.search(regexp) ); // 3 |
| 41 | +``` |
| 42 | + |
| 43 | +O método `str.search` busca pelo `padrão:/amo/` e retorna a posição dentro da string. Como devemos adivinhar, `padrão:/love/` é o padrão mais simples possível. O que ele faz é uma simples pesquisa de substring. |
| 44 | + |
| 45 | +O código acima é o mesmo que: |
| 46 | + |
| 47 | +```js run |
| 48 | +let str = "Eu amo JavaScript!"; // irá buscar aqui |
| 49 | + |
| 50 | +let substr = 'amo'; |
| 51 | +alert( str.search(substr) ); // 3 |
| 52 | +``` |
| 53 | + |
| 54 | +Então procurar pelo `padrão:/amo/` é o mesmo que procurar por `"amo"`. |
| 55 | + |
| 56 | +Mas isso é apenas por agora. Em breve nós iremos criar expressões regulares mais complexas com muito mais poder de busca. |
| 57 | + |
| 58 | +```smart header="Cores" |
| 59 | +A partir daqui, o esquema de cores é: |
| 60 | +
|
| 61 | +- regexp -- `padrão:vermelho` |
| 62 | +- string (onde nós buscamos) -- `sujeito:azul` |
| 63 | +- result -- `correspondência:verde` |
| 64 | +``` |
| 65 | + |
| 66 | + |
| 67 | +````smart header="Quando usar `new RegExp`?" |
| 68 | +Normalmente nós usamos a sintaxe curta `/.../`. Mas não suporta inserções variáveis `${...}`. |
| 69 | + |
| 70 | +Por outro lado, `new RegExp` permite construir um padrão dinamicamente de uma string, então é mais flexível. |
| 71 | + |
| 72 | +Aqui está um exemplo de uma regexp gerada dinamicamente: |
| 73 | + |
| 74 | +```js run |
| 75 | +let tag = prompt("Qual tag quer procurar?", "h2"); |
| 76 | +let regexp = new RegExp(`<${tag}>`); |
| 77 | + |
| 78 | +// procura <h2> por padrão |
| 79 | +alert( "<h1> <h2> <h3>".search(regexp)); |
| 80 | +``` |
| 81 | +```` |
| 82 | +
|
| 83 | +
|
| 84 | +## Flags |
| 85 | +
|
| 86 | +Expressões regulares podem ter flags que afetam a busca. |
| 87 | +
|
| 88 | +Existem apenas 5 delas em JavaScript: |
| 89 | +
|
| 90 | +`i` |
| 91 | +: Com essa flag a busca é case-insensitive: não faz distinção entre `A` e `a` (veja o exemplo abaixo). |
| 92 | +
|
| 93 | +`g` |
| 94 | +: Com essa flag a busca procura por todas as correspondências, sem ela -- apenas a primeira (nós veremos usos no próximo capítulo). |
| 95 | +
|
| 96 | +`m` |
| 97 | +: Modo multilinha (abordado no capítulo <info:regexp-multiline-mode>). |
| 98 | +
|
| 99 | +`s` |
| 100 | +: Modo "dotall", permite que o `.` corresponda às novas linhas (abordado no capítulo <info:regexp-character-classes>). |
| 101 | +
|
| 102 | +`u` |
| 103 | +: Habilita o suporte completo a unicode. A flag permite o processamento correto dos pares substitutos. Mais sobre isso no capítulo <info:regexp-unicode>. |
| 104 | +
|
| 105 | +`y` |
| 106 | +: Modo fixo (abordado no capítulo <info:regexp-sticky>) |
| 107 | +
|
| 108 | +Abordaremos todas essas flags mais adiante no tutorial. |
| 109 | +
|
| 110 | +Por agora, a mais simples flag é `i`, aqui está um exemplo: |
| 111 | +
|
| 112 | +```js run |
| 113 | +let str = "Eu amo JavaScript!"; |
| 114 | +
|
| 115 | +alert( str.search(/AMO/i) ); // 3 (encontrado em minúsculas) |
| 116 | +
|
| 117 | +alert( str.search(/AMO/) ); // -1 (nada encontrado sem a 'i' flag) |
| 118 | +``` |
| 119 | +
|
| 120 | +Então a `i` flag já faz as expressões regulares mais poderosas do que uma simples pesquisa de substring. Mas ainda há muito mais. Abodaremos outras flags e recursos nos próximos capítulos. |
| 121 | +
|
| 122 | +
|
| 123 | +## Sumário |
| 124 | +
|
| 125 | +- Uma expressão regular consiste de um padrão e flags opcionais: `g`, `i`, `m`, `u`, `s`, `y`. |
| 126 | +- Sem flags e símbolos especiais que iremos estudar depois, a busca por uma regexp é o mesmo que uma pesquisa de substring. |
| 127 | +- O método `str.search(regexp)` retorna o índice onde a correspondência é encontrada ou `-1` se não há correspondência. No próximo capítulo veremos outros métodos. |
0 commit comments