JavaScript se mantiene como el lenguaje de programación más utilizado y, sin duda, uno de los más versátiles sino el que más. Una de los motivos de que se encuentre en tan privilegiada posición es su constante evolución, la cual está guiada por ECMAScript, la especificación estándar que define cómo es el lenguaje y cómo debe comportarse. Hace tan solo unos días, como cada año, se ha lanzado la última iteración: ECMAScript 2024. Aunque las novedades en esta versión son relativamente pocas, es importante como desarrolladores mantenernos al día con estos cambios para aprovechar al máximo las capacidades del lenguaje.
¿Qué es ECMAScript?
ECMAScript es la especificación estándar del lenguaje de scripting que conocemos como JavaScript. Fue creada por Ecma International, una organización de estándares para tecnologías de la información y comunicación (La European Computer Manufacturers Association). El propósito de ECMAScript es proporcionar una base común y consistente para todas las implementaciones de JavaScript, asegurando la interoperabilidad entre diferentes navegadores y entornos de ejecución.
Mientras que ECMAScript es la especificación, JavaScript es la implementación más conocida y utilizada de este estándar. Podríamos decir que ECMAScript es a JavaScript lo que un plano es a un edificio: define la estructura, las reglas y las características que deben ser implementadas, mientras que el edificio es la implementación práctica de esos planos.
Desde su creación en 1997, ECMAScript ha pasado por varias versiones. Cada nueva edición introduce nuevas características, mejoras en la sintaxis y optimizaciones de rendimiento. El proceso de evolución es dirigido por el Comité Técnico 39 (TC39) de Ecma International, que sigue un proceso meticuloso de propuestas, revisiones y aprobaciones antes de incluir nuevas características en el estándar. Cada año, sobre finales de junio, lanzan una nueva especificación con novedades.
Vamos a ver las de 2024...
Novedades de ECMAScript 2024
1.- Agrupación de iterables síncronos
Map.groupBy() agrupa los elementos de un iterable en entradas de tipo Map, cuyas claves son proporcionadas por una función de callback:
assert.deepEqual(
Map.groupBy([0, -5, 3, -4, 8, 9], x => Math.sign(x)),
new Map()
.set(0, [0])
.set(-1, [-5,-4])
.set(1, [3,8,9])
);
En este caso se agrupan por su signo (positivo, negativo o cero, que no tiene signo ¿o puede que sí?) en función de lo que devuelve la función lambda que le hemos pasado como segundo argumento.
También existe un método idéntico para objetos, Object.groupBy(), que produce un objeto en lugar de un Map:
assert.deepEqual(
Object.groupBy([0, -5, 3, -4, 8, 9], x => Math.sign(x)),
{
'0': [0],
'-1': [-5,-4],
'1': [3,8,9],
__proto__: null,
}
);
2.- Nuevo constructor para promesas, que nos devuelve los resolutores
La forma más habitual de crear y resolver una Promesa es mediante el constructor correspondiente de la clase Promise:
new Promise(
(resolve, reject) => { ··· }
);
Una limitación de la creación de Promesas de esta manera es que las funciones de resolución, resolvey reject, solo pueden utilizarse desde dentro de la función de callback que devuelve la promesa. Pero, a veces, queremos usarlos fuera de esta. Ahí es cuando resulta útil el nuevo método "Fabric" estático que añade la especificación: Promise.withResolvers():
const { promise, resolve, reject } = Promise.withResolvers();
Que nos permite obtener accesos directos a la propia Promise, pero también a los métodos de resolución, de modo que podamos usarlos desde fuera de la propia promesa para ciertos usos avanzados.
3.- Nuevas funciones para ArrayBuffers y SharedArrayBuffers
Los ArrayBuffers incorporan dos características nuevas:
-
Se pueden cambiar de tamaño in situ, sin tener que regenerarlos:
const buf = new ArrayBuffer(2, {maxByteLength: 4});
// Este `typedArray` se crea copiando desde la posición 2
const typedArray = new Uint8Array(buf, 2);
assert.equal(
typedArray.length, 0
);
buf.resize(4);
assert.equal(
typedArray.length, 2
);
-
Se les añade el método .transfer()para transferirlos. La API web (ojo, no el estándar ECMAScript) ha admitido durante mucho tiempo la clonación estructurada para mover valores de forma segura entre dominios ( el objeto global, iframes, Web Workers...). Algunos objetos también se pueden transferir, es decir, que tras la clonación el original se separa (se vuelve inaccesible) y la propiedad cambia del original al clon. La transferencia suele ser más rápida que la copia, especialmente si se trata de grandes cantidades de memoria. Se puede llevar a cabo esta operación en ArrayBuffer, Stream, ImageBitmap y otras. Ahora se puede hacer directamente mediante este nuevo método.
Se puede cambiar el tamaño de los SharedArrayBuffers, pero solo pueden crecer y nunca reducirse de tamaño. No son transferibles, y por lo tanto no reciben el método .transfer().
4.- Nuevo flag para agrupaciones de grafemas en expresiones regulares
Esto es algo un poco de nicho, pero el nuevo indicador /v para expresiones regulares mejora el anterior /u (para coincidencias con caracteres Unicode). En realidad es una mejora que sustituye al anterior flag /u, y se recomienda usarlo por defecto y obviar el uso del anterior.
Lo que permite es que comparaciones como estas funcionen bien:
-
Escapes para propiedades de cadena Unicode (el emoji 😵💫 consta de tres puntos de código):
// Antes:
assert.equal(
/^\p{Emoji}$/u.test('😵💫'), false
);
// Ahora: con la propiedad `RGI_Emoji` y /v
assert.equal(
/^\p{RGI_Emoji}$/v.test('😵💫'), true
);
-
Literales de cadena a través \q{}para clases de caracteres:
> /^[\q{😵💫}]$/v.test('😵💫')
true
> /^[\q{abc|def}]$/v.test('abc')
true
-
Establecer operaciones para clases de personajes:
> /^[\w--[a-g]]$/v.test('a')
false
> /^[\p{Number}--[0-9]]$/v.test('٣')
true
> /^[\p{RGI_Emoji}--\q{😵💫}]$/v.test('😵💫')
false
También se ha mejorado la coincidencia /i (para comparaciones que no tienen en cuenta mayúsculas y minúsculas) en el caso de negar el escape de una propiedad Unicode mediante[^···]
5.- Asegurarse de que las cadenas estén bien formadas
Se han añadido dos nuevos métodos cuyo objetivo es tratar de garantizar que las cadenas de texto estén bien formadas (con unidades de código UTF-16 ).
Se refieren a la posibilidad de que existan "sustitutos solitarios" o (lone surrogates) en las cadenas.
En el contexto de UTF, un "lone surrogate" se refiere a un código de punto que pertenece a la categoría de los "high-surrogate" (de U+D800 a U+DBFF) o los "low-surrogate" (de U+DC00 a U+DFFF) pero que aparece de manera aislada, es decir, sin su par correspondiente. En UTF-16, los caracteres que no pueden ser representados en un solo código de 16 bits se codifican utilizando pares de sustitutos (surrogate pairs), donde un "high-surrogate" es seguido por un "low-surrogate". Un "lone surrogate" es un error de codificación ya que no forma un par válido.
Para evitar que recibamos cadenas mal codificadas debido a estos elementos solitarios tenemos dos nuevos métodos para la clase String:
.isWellFormed() comprueba si una cadena JavaScript está bien formada y no contiene ningún sustituto solitario..toWellFormed() devuelve una copia del receptor donde cada sustituto solitario se reemplaza con la unidad de código 0xFFFD (que representa el punto de código con el mismo número, cuyo nombre es "carácter de reemplazo"). Por tanto, el resultado está bien formado.
Nuevamente, esta novedad la usarás en muy pocas ocasiones, pero si la necesitas te puede salvar el día y conviene conocer su existencia.
6.- Espera asíncrona por cambios en memoria compartida
Una nueva característica avanzada orientada al manejo de datos en memoria.
JavaScript tiene toda una API para lo que denomina "Operaciones atómicas". Cuando se comparte la memoria, varios subprocesos pueden leer y escribir los mismos datos en la memoria. Las operaciones atómicas garantizan que se escriban y lean valores predecibles, que las operaciones finalicen antes de que comience la siguiente operación y que las operaciones no se interrumpan.
La nueva función para operaciones atómicas, Atomics.waitAsync() permite esperar a que algo que nos interese cambie en un elemento compartido de memoria sin interrumpir el hilo actual (se ejecutan asíncronamente).
De nuevo, solo para las ocasiones.
La importancia de mantenerse actualizado
Para los desarrolladores, seguir las actualizaciones de ECMAScript es fundamental por varias razones:
- Mejora de la productividad: las nuevas características a menudo simplifican tareas comunes o introducen formas más eficientes de escribir código avanzado.
- Optimización del rendimiento: muchas actualizaciones incluyen mejoras que pueden hacer que el código se ejecute más rápido o use menos memoria.
- Compatibilidad: conocer las últimas especificaciones ayuda a escribir código más compatible y a entender mejor las limitaciones en diferentes entornos de ejecución.
- Innovación: las nuevas características pueden inspirar nuevos patrones de diseño y enfoques para resolver problemas.