3

Há algum tempo descobri que expressões regulares também podem usar a flag u, que penso ser abreviação para Unicode.

  • Qual o propósito dessa flag?
  • Sei que foi adicionada em alguma versão recente do ECMAScript, então quais comportamentos ela modifica nas expressões regulares?
  • Tem relação com alguma outra flag?
0

1 Resposta 1

4

Esta flag muda alguns aspectos na forma como a regex trata a string.


Interpretação de code points em Surrogate pairs

Por exemplo, se a string tiver o emoji 💩 (PILE OF POO). Ele é um "caractere" (no sentido de ter um code point definido pelo Unicode - leia aqui para mais detalhes). No caso, o code point dele é U+1F4A9, e como já vimos aqui, code points acima de U+FFFF são armazenados internamente na forma de surrogate pairs (no caso, o emoji é "quebrado"/decomposto em dois valores: 0xD83D e 0xDCA9).

Então imagine uma regex que verifica se a string tem apenas um caractere: /^.$/. Esta regex tem o início e fim da string (os marcadores ^ e $) e entre eles tem o ponto, que corresponde a um code point (exceto quebras de linha).

Sem a flag u, o ponto considera que cada parte do surrogate pair é um code point separado. Com a flag, ele interpreta as duas partes do surrogate pair como um único code point:

const s = '💩';
console.log(s.length); // 2 <- o codepoint usa 2 code units
console.log(s.charCodeAt(0).toString(16)); // d83d
console.log(s.charCodeAt(1).toString(16)); // dca9

// testando se tem apenas um code point
console.log(/^.$/.test(s)); // false
console.log(/^.$/u.test(s)); // true

// testando se tem dois code points
console.log(/^.{2}$/.test(s)); // true
console.log(/^.{2}$/u.test(s)); // false

Repare que sem a flag, a regex com um único ponto falha, porque ela considera que cada parte do surrogate pair é um code point separado (e só funciona quando usamos uma regex que busca por dois code points).

Já com a flag, o ponto interpreta o surrogate pair como um único code point, encontrando um match (e falhando quando procuramos por dois code points).


Podemos ver este comportamento também se estivermos buscando especificamente por partes do surrogate pair:

const s = '💩';

// buscando pelas partes do surrogate pair
console.log(/\uD83D/.test(s)); // true
console.log(/\uDCA9/.test(s)); // true

// com a flag u, não funciona mais (pois as partes do surrogate pair não são mais verificadas separadamente)
console.log(/\uD83D/u.test(s)); // false
console.log(/\uDCA9/u.test(s)); // false

Ou, se eu quiser verificar se a string tem dois 💩:

const s = '💩💩';

// sem a flag, cada parte do surrogate pair é tratado separadamente
console.log(/\uD83D\uDCA9{2}/.test(s)); // false
// ou seja, o {2} é aplicado somente ao \uDCA9
console.log(/\uD83D\uDCA9{2}/.test("\uD83D\uDCA9\uDCA9")); // true

// com a flag, o {2} é aplicado a todo o surrogate pair
console.log(/\uD83D\uDCA9{2}/u.test(s)); // true
console.log(/\uD83D\uDCA9{2}/u.test("\uD83D\uDCA9\uDCA9")); // false

No caso, sem a flag, o quantificador {2} é aplicado somente ao \uDCA9 (já que cada parte do surrogate pair é tratada separadamente), enquanto que com a flag, o {2} é aplicado a todo o surrogate pair, detectando corretamente que há dois emojis na string.

Isso interfere também no tamanho do match retornado:

const s = '💩';

// retorna um array com 2 elementos (as partes do surrogate pair)
console.log(s.match(/./g).map(s => s.codePointAt(0).toString(16))); // ["d83d", "dca9"]

// retorna um array com 1 elemento (o próprio emoji)
console.log(s.match(/./gu).map(s => s.codePointAt(0).toString(16))); // ["1f4a9"]

Claro que se a string só tiver caracteres cujos code points sejam menores que U+FFFF, isso não será uma preocupação.


Unicode Property Escapes

A flag u também habilita o uso de Unicode Property Escapes:

const s = "平仮名";

console.log(s.match(/\p{L}/gu) ); // 平 仮 名
console.log(s.match(/\p{L}/g) ); // null

No caso, \p{L} procura por qualquer code point que seja uma letra definida pelo Unicode (são todas as categorias que começam com "L" desta lista). Mas isso só funciona se tiver a flag u habilitada.

Não vou citar todas as possibilidades de Unicode Properties, mas pela documentação já dá para ter uma boa ideia das opções existentes.
Mas apenas para citar um exemplo, um uso seria para contornar a limitação de atalhos como \w e \b, que em JavaScript só consideram os caracteres ASCII (mesmo com a flag u habilitada). Exemplo:

// \b e \w não levam em conta caracteres acentuados
console.log('sábia sabiá'.match(/\b\w+\b/gu)); // ["s", "bia", "sabi"]

// \p{L} leva em conta caracteres acentuados
console.log('sábia sabiá'.match(/(?<!\p{L})\p{L}+(?!\p{L})/gu)); // ["sábia", "sabiá"]


Escapes e atributo pattern

Existe ainda outro detalhe (que já foi descrito nesta resposta): quando a flag u está presente, somentes alguns caracteres podem ser escapados com \ - no caso, são apenas: ^ $ \ . * + ? ( ) [ ] { } |.

Ou seja, uma regex que tenha algo como \- funciona normalmente sem a flag (é interpretado como um hífen mesmo), mas com a flag dá erro:

// sem a flag u - funciona
let semUnicode = /\d\-\d/;
console.log('válido:', semUnicode);

// com a flag u - erro
let comUnicode = /\d\-\d/u;
console.log('Não vai imprimir esta mensagem porque dá erro na linha acima');

Isso porque \- é redundante, já que basta colocar - para que seja interpretado como um hífen (exceto dentro de uma classe de caracteres, na qual o hífen tem significado especial: [a-z] é uma letra de a a z e [a\-z] é "a letra a, ou um hífen, ou a letra z").

Outro ponto é que no atributo pattern de um campo HTML, a regex sempre é compilada com a flag u habilitada.


Unicode code point escapes

Outro recurso que é habilitado com a flag u é o uso de code point escape para valores acima de U+FFFF:

const s = '💩';

// sem a flag, procura literalmente por "u{1f4a9}"
let r = /\u{1f4a9}/;
console.log(r.test(s)); // false
console.log(r.test('u{1f4a9}')); // true

// com a flag, procura pelo code point U+1F4A9
r = /\u{1f4a9}/u;
console.log(r.test(s)); // true
console.log(r.test('u{1f4a9}')); // false

Para valores abaixo de U+FFFF, como já vimos nos exemplos acima, basta usar \uHHHH (onde HHHH é o valor do code point em hexadecimal), e nem precisa da flag para tal (ela só muda a intepretação dos surrogate pairs). Mas para valores acima de U+FFFF precisamos usar a sintaxe \u{...} (o valor do code point fica entre chaves), e para que isso funcione, precisa da flag u habilitada (caso contrário, ele buscará literalmente pelos caracteres u, {, etc).


Quantificadores

Outro caso que dá diferença (conforme explicado aqui):

// sem flag "u", OK
let r1 = /[a-z]{,2}/;
console.log('regex ok', r1);

// com flag "u", erro (Incomplete quantifier)
let r2 = /[a-z]{,2}/u;
console.log('não será impresso, pois dá erro na linha acima', r2);

Repare que a primeira regex não dá erro, mas a segunda sim. A presença da flag u faz com que a sintaxe se torne mais restrita e não aceite o quantificador sem o valor inicial (dá um erro: "Incomplete quantifier").

Para corrigir, deve-se indicar explicitamente que o valor mínimo é zero:

// indicar o valor mínimo igual a zero
let r = /[a-z]{0,2}/u;
console.log('regex OK', r);

Vale lembrar ainda que {,2}, embora não dê erro sem a flag u, não é interpretado como um quantificador, e sim como literalmente o caractere {, seguido de vírgula, seguido de 2, seguido de }. Veja:

let r = /[a-z]{,2}/;

// no máximo 2 letras (não funciona)
console.log(r.test('a')); // false

// porque a regex na verdade é "uma letra, seguida de {,2}"
console.log(r.test('a{,2}')); // true


Relação com outras flags

Não existe uma relação direta com outras flags, mas pode ser usada em conjunto (como em alguns exemplos acima, que têm a flag g também).

Mas claro que isso pode dar diferença em alguns casos, graças às esquisitices do Unicode. Por exemplo, se eu quiser buscar por todos os codepoints que equivalem à letra "s" de forma case insensitive (portanto, usando a flag i):

console.log('Com a flag:');
let r = /s/iu;
for (let i = 0; i <= 0x10ffff; i++) {
    const s = String.fromCodePoint(i);
    if (r.test(s)) {
        console.log(`${i.toString(16)} = ${s}`);
    }
}

console.log('\n-----------------\nSem a flag:');
r = /s/i;
for (let i = 0; i <= 0x10ffff; i++) {
    const s = String.fromCodePoint(i);
    if (r.test(s)) {
        console.log(`${i.toString(16)} = ${s}`);
    }
}

Sem a flag u, somente as letras s e S são encontradas. Mas com a flag, também é encontrada a letra ſ (LATIN SMALL LETTER LONG S).


Terminologia

O nome da flag (u) vem de "unicode", conforme consta na documentação. E na especificação da linguagem também há menção a este termo:

Unicode is true if the RegExp object's [[OriginalFlags]] internal slot contains "u" and otherwise is false.

When the Unicode flag is true, "all characters" means the CharSet containing all code point values; otherwise "all characters" means the CharSet containing all code unit values.

Inclusive, o segundo parágrafo acima descreve o comportamento mencionado no início, de tratar as partes de um surrogate pair como uma coisa só ou não.

Por fim, as instâncias de RegExp possuem a propriedade unicode, indicando se a flag está ativa ou não:

let r = /abc/;
console.log(r.unicode); // false

r = /abc/u;
console.log(r.unicode); // true

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .