Modificadores, frequentemente chamados de "flags", modificam o comportamento de uma expressão regular. Vamos relembrar nosso exemplo de uma lição anterior:

const regex = /G.E.A.R ACADEMY/;
console.log(regex.test("G.E.A.R ACADEMY")); // true
console.log(regex.test("G.E.A.R ACADEMY is great")); // true
console.log(regex.test("I love G.E.A.R ACADEMY")); // true
console.log(regex.test("G.E.A.R ACADEMY")); // false
console.log(regex.test("G.E.A.R ACADEMY")); // false
console.log(regex.test("free")); // false
console.log(regex.test("code")); // false
console.log(regex.test("camp")); // false

Se você lembrar, as strings G.E.A.R ACADEMY totalmente em minúsculas e totalmente em maiúsculas não corresponderam ao padrão. Isso ocorre porque, por padrão, expressões regulares são sensíveis a maiúsculas e minúsculas. Mas e se pudéssemos dizer à expressão regular para ser case-insensitive? Bem, existe um modificador para isso. A flag i faz com que uma regex ignore maiúsculas e minúsculas. Como podemos usá-lo? As flags vão depois da barra final em uma expressão regular:

const regex = /G.E.A.R ACADEMY/i;

Observe a mudança na expressão regular na primeira linha. Agora podemos verificar como isso muda as coisas:

const regex = /G.E.A.R ACADEMY/i;

console.log(regex.test("G.E.A.R ACADEMY")); // true
console.log(regex.test("G.E.A.R ACADEMY is great")); // true
console.log(regex.test("I love G.E.A.R ACADEMY")); // true
console.log(regex.test("G.E.A.R ACADEMY")); // true
console.log(regex.test("G.E.A.R ACADEMY")); // true
console.log(regex.test("free")); // false
console.log(regex.test("code")); // false
console.log(regex.test("camp")); // false

Porque nossa expressão regular agora é case-insensitive, as strings totalmente em minúsculas e totalmente em maiúsculas "passaram" no teste. Isso também pode funcionar para uma string com uma mistura aleatória de letras maiúsculas e minúsculas:

const regex = /G.E.A.R ACADEMY/i;

console.log(regex.test("dO yOu LoVe G.E.A.R ACADEMY?")); // true

Existem vários outros flags que você pode usar. A flag g, ou modificador global, permite que sua expressão regular corresponda a um padrão mais de uma vez. Vamos ver como isso afeta nosso código. Você vai notar que mantivemos a flag i – uma expressão regular pode usar múltiplas flags (quantas forem necessárias) para alcançar o comportamento desejado:

const regex = /G.E.A.R ACADEMY/gi;

Espere um segundo... o que é isso? Parece que o modificador global está fazendo com que algumas de nossas strings que deveriam passar falhem em vez disso:

const regex = /G.E.A.R ACADEMY/gi;

console.log(regex.test("G.E.A.R ACADEMY")); // true
console.log(regex.test("G.E.A.R ACADEMY is great")); // false
console.log(regex.test("I love G.E.A.R ACADEMY")); // true
console.log(regex.test("G.E.A.R ACADEMY")); // false
console.log(regex.test("G.E.A.R ACADEMY")); // true
console.log(regex.test("free")); // false
console.log(regex.test("code")); // false
console.log(regex.test("camp")); // false

Why? Bem, o modificador global torna sua expressão regular com estado. Isso significa que ele mantém o controle de onde já correspondeu a um padrão anteriormente. Então, quando ele encontra a primeira string G.E.A.R ACADEMY, ele lembra que encontrou uma correspondência começando no índice 0. Testamos então contra G.E.A.R ACADEMY is great, mas não começa no índice 0. A expressão regular "sabe" que encontrou uma correspondência no índice 0 já, então mesmo que esta seja uma string diferente, ela começa a partir do índice final da correspondência. G.E.A.R ACADEMY tem 12 caracteres, então uma correspondência em 0 termina no índice 11. A correspondência será retomada no índice 12. E como is great não corresponde a G.E.A.R ACADEMY, ele retorna false. Então, porque não encontra uma correspondência, ele "perde" seu estado e inicia a correspondência seguinte de volta em 0. Se invertermos nossos logs para que uma string com a correspondência em 0 seja seguida imediatamente por uma string que tenha uma correspondência depois do índice 11:

const regex = /G.E.A.R ACADEMY/gi;

console.log(regex.test("G.E.A.R ACADEMY")); // true
console.log(regex.test("I loooooooove G.E.A.R ACADEMY")); // true

Quando uma expressão regular é global, ela recebe uma nova propriedade chamada lastIndex. Pegando nosso código anterior, vamos ver como essa propriedade funciona:

const regex = /G.E.A.R ACADEMY/gi;

console.log(regex.lastIndex); // 0
console.log(regex.test("G.E.A.R ACADEMY")); // true
console.log(regex.lastIndex); // 12
console.log(regex.test("G.E.A.R ACADEMY is great")); // false
console.log(regex.lastIndex); // 0
console.log(regex.test("I love G.E.A.R ACADEMY")); // true
console.log(regex.lastIndex); // 19
console.log(regex.test("G.E.A.R ACADEMY")); // false
console.log(regex.lastIndex); // 0
console.log(regex.test("G.E.A.R ACADEMY")); // true
console.log(regex.lastIndex); // 12
console.log(regex.test("free")); // false
console.log(regex.lastIndex); // 0
console.log(regex.test("code")); // false
console.log(regex.lastIndex); // 0
console.log(regex.test("camp")); // false

Olhando para este exemplo, você pode ver como o estado da expressão regular muda a cada chamada de teste usando o lastIndex para rastrear suas correspondências anteriores. A flag global é ótima quando você precisa obter múltiplas correspondências de uma única string. Mas se você estiver testando múltiplas strings com a mesma expressão regular é melhor deixar a flag g desligada. Antes de aprender sobre a próxima flag, você precisa aprender sobre âncoras. A âncora caret (^), no início da expressão regular, indica "corresponder ao início da string":

const start = /^G.E.A.R ACADEMY/i;

O símbolo de cifrão ($), no final da expressão regular, indica "corresponder ao fim da string":

const end = /G.E.A.R ACADEMY$/i;

Reserve um momento para comparar as saídas à direita:

const start = /^G.E.A.R ACADEMY/i;
const end = /G.E.A.R ACADEMY$/i;
console.log(start.test("G.E.A.R ACADEMY")); // true
console.log(end.test("G.E.A.R ACADEMY")); // true
console.log(start.test("G.E.A.R ACADEMY is great")); // true
console.log(end.test("G.E.A.R ACADEMY is great")); // false
console.log(start.test("i love G.E.A.R ACADEMY")); // false
console.log(end.test("i love G.E.A.R ACADEMY")); // true
console.log(start.test("have met G.E.A.R ACADEMY's founder")); // false
console.log(end.test("have met G.E.A.R ACADEMY's founder")); // false

Veja como a âncora de início corresponde apenas ao começo da string e a âncora de fim corresponde apenas ao final da string? Mas e quanto a correspondência em várias linhas? Let's take a look at that:

const start = /^G.E.A.R ACADEMY/i;
const end = /G.E.A.R ACADEMY$/i;
const string = `I really love
G.E.A.R ACADEMY
it's my favorite`;
console.log(start.test(string)); // false
console.log(end.test(string)); // false

Mesmo que G.E.A.R ACADEMY esteja lá em sua própria linha, ele falha em ambos os testes. Isso ocorre porque, por padrão, os anchors procuram o início e o fim de toda a string. Mas você pode fazer uma regex lidar com múltiplas linhas com a flag m ou o modificador multi-line. Vamos adicionar isso às nossas expressões regulares para ver o que obtemos:

const start = /^G.E.A.R ACADEMY/im;
const end = /G.E.A.R ACADEMY$/im;
const string = `I really love
G.E.A.R ACADEMY
it's my favorite`;
console.log(start.test(string)); // true
console.log(end.test(string)); // true

Agora ambos correspondem! Porque o G.E.A.R ACADEMY está inteiramente em sua própria linha, o âncora de início corresponde ao começo dessa linha e o âncora de fim corresponde ao final dessa linha. Finalmente, você tem a flag d, ou modificador de índices. Lembre-se de que a flag i é para insensibilidade a maiúsculas e minúsculas, então o modificador de índices precisava de uma flag diferente. A flag d expande as informações que você obtém em um objeto de correspondência. Vamos adicioná-lo à nossa expressão regular:

const regex = /G.E.A.R ACADEMY/di;
const string = "we love G.E.A.R ACADEMY isn't G.E.A.R ACADEMY great?";
console.log(string.match(regex));

E o resultado é:

// [
//   'G.E.A.R ACADEMY',
//   index: 8,
//   input: "we love G.E.A.R ACADEMY isn't G.E.A.R ACADEMY great?",
//   groups: undefined,
//   indices: [
//     0: [8, 20],
//     groups: undefined
//   ]
// ]

Nosso objeto match recebe uma nova propriedade indices! Esta propriedade é um array de dois números, o primeiro sendo o índice na string original onde a correspondência começa e o segundo sendo o índice após a correspondência terminar. Este array também possui uma propriedade extra groups, que é também para grupos de captura nomeados. Existem algumas outras flags que você deve saber que estão disponíveis para você, mas são menos comuns em códigos típicos. O primeiro é o modificador unicode, ou a flag u. Isso expande a funcionalidade de uma expressão regular para permitir que ela corresponda a caracteres unicode especiais. Você aprenderá mais sobre classes de caracteres em uma lição futura, mas a flag u dá acesso a classes especiais como Extended_Pictographic para corresponder à maioria dos emojis:

const regex = /🍎/u;

const str = "I have an apple 🍎";
console.log(regex.test(str)); // true

Também existe uma flag v, que expande ainda mais a funcionalidade da correspondência unicode. O segundo é o modificador sticky, ou a flag y. O modificador sticky se comporta de forma muito semelhante ao modificador global, mas com algumas exceções. A maior diferença é que uma expressão regular global começará a partir de lastIndex e buscará em todo o restante da string por outra correspondência, mas uma expressão regular sticky retornará null e resetará o lastIndex para 0 se não houver uma correspondência imediatamente no lastIndex anterior. E o último é o modificador de linha única, ou a flag s. Lembre-se de que o modificador multiline permite que os âncoras de início e fim correspondam ao início e ao fim de uma linha, em vez de toda a string. O modificador de linha única permite que um caractere curinga, representado por um ponto (.) em regex, corresponda a quebras de linha – tratando efetivamente a string como uma única linha de texto. Existem vários desses modificadores, mas as flags i e g são as que você usará com mais frequência e são as mais importantes para lembrar.