Entendiendo Unicode en JavaScript: Banderas y Clases
Aprende la bandera "u" de regex en JavaScript para el manejo correcto de puntos de código y pares sustitutos, además de las clases de propiedad Unicode \p{...} y \P{...}.
Introducción a Unicode
JavaScript admite Unicode, un estándar de codificación de caracteres que permite representar texto de múltiples idiomas y escrituras. Unicode es esencial para desarrollar aplicaciones internacionalizadas y manejar datos de texto diverso de manera eficaz. En este capítulo exploraremos las banderas y clases Unicode en JavaScript, examinando su uso y proporcionando ejemplos prácticos para mejorar tu comprensión.
La bandera Unicode u
La bandera u habilita la coincidencia Unicode completa en expresiones regulares. De forma predeterminada, una regex trata una cadena como una secuencia de unidades de código UTF-16. Los caracteres fuera del Plano Multilingüe Básico (BMP) — emojis, muchos símbolos matemáticos y escrituras menos comunes — se almacenan como un par sustituto: dos unidades de código que juntas codifican un punto de código. Sin la bandera u, el motor de regex ve esas dos mitades por separado, lo que rompe ., los rangos de caracteres y los cuantificadores para dichos caracteres.
Con la bandera u activada, el motor trabaja en términos de puntos de código en lugar de unidades de código, por lo que un solo carácter astral cuenta como un único carácter.
Pares sustitutos y por qué importa la bandera
. coincide con un solo carácter. Sin u, solo coincide con una unidad de código, por lo que no puede coincidir por sí sola con un carácter astral completo.
😀 es el par sustituto de 😀. String#length devuelve 2 porque cuenta unidades de código, mientras que al expandir la cadena en un array (que itera por puntos de código) se obtiene 1. Sin u, /^.$/ falla porque . solo coincide con una de las dos mitades; con u coincide con el carácter completo.
Usando la bandera u
Aquí 👍 es el emoji de pulgar arriba. Sin la bandera u, la regex a.b no puede coincidir porque . solo consume la mitad del par sustituto. Con la bandera u, . consume el punto de código completo, por lo que el patrón sí coincide.
Contar caracteres correctamente
Una regex con la bandera u y la bandera g permite iterar sobre caracteres reales, incluso los astrales.
Combinar la bandera u con otras banderas
La bandera u se combina con las demás banderas. Este ejemplo añade global (g) y sin distinción de mayúsculas/minúsculas (i).
Este ejemplo muestra cómo combinar la bandera u con las banderas global (g) e insensible a mayúsculas/minúsculas (i). La regex coincide correctamente con A👍b, ilustrando cómo la bandera u puede usarse junto con otras banderas para una coincidencia más flexible.
Escapes de propiedades Unicode: \p{...} y \P{...}
Los escapes de propiedades Unicode ofrecen una forma de hacer coincidir caracteres según sus propiedades Unicode. Esta característica, introducida en ECMAScript 2018, facilita el trabajo con tipos específicos de caracteres.
Sintaxis de los escapes de propiedades Unicode
\p{Property=Value}: Coincide con caracteres que tienen la propiedad especificada.\P{Property=Value}: Coincide con caracteres que no tienen la propiedad especificada.
Propiedades Unicode comunes
Para categorías generales de una sola letra, puedes escribir el nombre de la propiedad directamente: \p{L} es la forma abreviada de \p{General_Category=Letter}.
- Categoría general: Hace coincidir caracteres según su categoría general.
\p{L}(Letra): Coincide con cualquier letra, en cualquier escritura.\p{N}(Número): Coincide con cualquier carácter numérico.\p{P}(Puntuación): Coincide con signos de puntuación.\p{Lu}/\p{Ll}: Letras mayúsculas / minúsculas.
- Script: Hace coincidir caracteres pertenecientes a un sistema de escritura.
\p{Script=Greek}(o\p{sc=Greek}): Caracteres griegos.\p{Script=Han}: Caracteres Han (chino, japonés, coreano).\p{Script=Cyrillic}: Caracteres cirílicos.
- Propiedades binarias: Hacen coincidir caracteres que tienen un rasgo determinado.
\p{Emoji},\p{Emoji_Presentation}: Caracteres emoji.\p{White_Space}: Espacios en blanco.
La forma en mayúscula \P{...} es la negación — coincide con cada carácter que no tiene la propiedad. Para una cobertura más detallada de la forma entre corchetes [...], consulta las clases de caracteres.
Ejemplos de escapes de propiedades Unicode
Aquí, \p{L} coincide con cualquier letra. La regex \p{L}+ encuentra todas las secuencias de letras en la cadena 'Hello123', devolviendo ["Hello"].
En este ejemplo, \p{N} coincide con cualquier número. La regex \p{N}+ extrae todas las secuencias numéricas de la cadena 'Hello123', resultando en ["123"].
\P{L} es el inverso de \p{L}, por lo que \P{L}+ captura los fragmentos que no contienen letras — aquí "123!".
Este ejemplo usa \p{Script=Greek} para hacer coincidir caracteres griegos. La regex coincide correctamente con la cadena griega 'αβγδε'.
Coincidencia de emojis
Como \p{...} requiere u, también maneja correctamente los emojis astrales — cada emoji se trata como un único carácter.
El uso de escapes de propiedades Unicode puede afectar el rendimiento, especialmente con grandes volúmenes de datos de texto. Optimiza tus expresiones regulares y prueba su rendimiento en tu caso de uso específico.
Aplicaciones prácticas
Validación de entradas de usuario
Los escapes de propiedades Unicode permiten validar entradas de usuario con mayor precisión, asegurando que solo se acepten los caracteres permitidos.
Esta regex garantiza que un nombre de usuario válido comience con al menos dos letras, seguidas de cualquier combinación de letras y números. 'User123' pasa la validación, mientras que '123User' no.
Extracción de caracteres específicos
Puedes extraer tipos específicos de caracteres de una cadena usando escapes de propiedades Unicode.
En este ejemplo, \p{L}+ coincide con todas las secuencias de letras en la cadena 'Hello, κόσμε!', devolviendo ["Hello", "κόσμε"].
Usa siempre la bandera u con los escapes de propiedades Unicode
Al usar escapes de propiedades Unicode, activa siempre la bandera u para garantizar una coincidencia correcta. Sin esta bandera, los escapes de propiedad lanzarán un SyntaxError.
Conclusión
Comprender y utilizar Unicode en JavaScript es fundamental para desarrollar aplicaciones robustas e internacionalizadas. Aprovechando la bandera u y los escapes de propiedades Unicode, puedes manejar datos de texto diverso de forma más eficaz y realizar coincidencias de caracteres precisas. Incorpora estas técnicas en tus proyectos para mejorar su funcionalidad y garantizar que cumplan con los estándares globales.