JavaScript está evolucionando constantemente, y cada año trae un nuevo conjunto de características diseñadas para facilitar la vida de los desarrolladores. ES2023, la última actualización, está repleta de nuevas herramientas que mejoramos cómo escribimos, leemos y mantenemos código. Vamos a sumergirnos en algunas de las características destacadas que querrá comenzar a usar en sus proyectos.

1. Array FindLast y FindLastIndex

¿Alguna vez ha necesitado encontrar un elemento en una matriz a partir del final? ES2023 presenta Findlast y FindlastIndex, que hacen exactamente eso.

• Findlast: este método encuentra el último elemento en una matriz que cumple con una condición especificada.

  const numbers = [1, 2, 3, 4, 5];
  const lastEven = numbers.findLast(num => num % 2 === 0); // 4

  // Find last user who is 18 years old in large array
  const users = [/* array with 10000 users */]; 
  users.findLast(user => user.age === 18);

• FindLastIndex: este método devuelve el índice de ese último elemento.

  const lastEvenIndex = numbers.findLastIndex(num => num % 2 === 0); // 3

Estos métodos son excelentes para aquellas situaciones en las que necesita revertir su lógica de búsqueda, haciendo que su código sea más claro y potencialmente más eficiente.

2. hashbangs (#!) En archivos JavaScript

Si está escribiendo herramientas de línea de comandos en JavaScript, apreciará el nuevo soporte para los hashbangs. Agregando un #! En la parte superior de su archivo, puede especificar el intérprete directamente, haciendo que su script sea ejecutable sin necesidad de un comando externo.

#!/usr/bin/env node

console.log("Hello, world!");

Esta es una característica pequeña pero útil, especialmente para aquellos que construyen herramientas CLI en Node.js.

3. símbolos como claves de mapas débiles

Anteriormente, solo los objetos podían usarse como claves en DeakMap, pero ES2023 cambia eso al permitir símbolos también.

const wm = new WeakMap();
const sym = Symbol('key');
wm.set(sym, 'value');

console.log(wm.get(sym)); // 'value'

// Storing hidden game data that players can't easily access, such as secret unlock codes:
const secretCode = Symbol('vc-cheat-code');
const gameData = new WeakMap();
gameData.set(secretCode, 'PANZER-ASPIRINE-BIGBANG-PRECIOUSPROTECTION'); 

Esta mejora hace que el mapas débiles sea aún más versátil, particularmente cuando necesita claves únicas sin colisión que proporcionen los símbolos.

4. Agrupación de la matriz por método

Agrupar elementos de matriz se ha vuelto mucho más fácil con el método de nuevo grupo.

• Grupo: este método organiza su matriz en un objeto, con claves determinadas por una función que proporciona y valora como matrices de elementos que coinciden con cada clave.

  const animals = [
    { type: 'mammal', name: 'dog' },
    { type: 'bird', name: 'sparrow' },
    { type: 'mammal', name: 'cat' },
  ];

  const grouped = animals.group(({ type }) => type);
  console.log(grouped);
  // {
  //   mammal: [{ type: 'mammal', name: 'dog' }, { type: 'mammal', name: 'cat' }],
  //   bird: [{ type: 'bird', name: 'sparrow' }]
  // }

Esta característica es perfecta para escenarios en los que necesita clasificar los datos de manera rápida y eficiente.

5. array.prototype.tosorted y array.prototype.toreVered ()

clasificación de matrices acaba de obtener mucho más limpio con tosorted. A diferencia de Sort, que altera la matriz original, Tosorted devuelve una nueva matriz clasificada y Ratoreved Devuelve una nueva matriz invertida, dejando el original sin tocar.

const arr = [3, 1, 4, 1, 5];
const sortedArr = arr.toSorted();
console.log(sortedArr); // [1, 1, 3, 4, 5]
console.log(arr); // [3, 1, 4, 1, 5]

let data = [/* important data that shouldn't be modified */];
let reversedData = data.toReversed(); // Safely reverse

Este método es un gran ajuste para cuando necesita preservar la matriz original mientras trabaja con una versión ordenada.

6. array.prototype.with

El método con una forma simple de crear una nueva matriz reemplazando un elemento en un índice específico.

const numbers = [10, 20, 30, 40];
const newNumbers = numbers.with(2, 25); // [10, 20, 25, 40]

Este método es perfecto cuando desea actualizar una matriz inmutable, lo que hace que sea más fácil administrar el estado en los patrones de programación funcional.

7. promise.withresolvers

Administrar promesas nunca ha sido más fácil, gracias a Promise.withresolvers. Este nuevo método le permite crear una promesa junto con sus funciones de resolución y rechazo de una vez.

const { promise, resolve, reject } = Promise.withResolvers();

setTimeout(() => resolve("done"), 1000);

promise.then(console.log); // "done"

Es una forma ordenada y concisa de manejar operaciones asíncronas, especialmente cuando necesita controlar el resultado de la promesa desde fuera de su constructor.

Soporte del navegador para ES2023

ES2023, la última versión de JavaScript, es bastante nueva ya que acaba de terminar en 2023. Esto significa que no todos los navegadores web pueden usar sus nuevas funciones todavía, pero están comenzando a:

• Firefox, Chrome y Edge admiten algunas características array.prototype.findlast () y array.prototype.findlastIndex ()
• Safari aún no admite ninguna de estas funciones.

• node.js

  • node.js versión 19.0 y arriba puede usar:
    • array.prototype.findlast ()
    • array.prototype.findlastIndex () Se espera que agregue más funciones de ES2023 en actualizaciones futuras.

transpilers:
Para usar las nuevas funciones de ES2023 ahora, los desarrolladores pueden convertir el código ES2023 en una versión anterior que comprenden más navegadores, utilizando herramientas llamadas transpiladores, como Babel. De esta manera, puede comenzar a usar las cosas nuevas, incluso si los navegadores aún no están listos para ello.

En este momento, el soporte para ES2023 sigue creciendo. Los grandes navegadores como Firefox y Chrome están comenzando a incluir algunas de sus características. Para obtener detalles sobre lo que es compatible con el lugar, puede consultar, ¿puedo usar? El uso de transpiladores ayuda a que estas nuevas características sean utilizables hoy, mientras esperamos que los navegadores se pongan al día en los próximos años.

Conclusión

ES2023 trae una gama de nuevas características que hacen que JavaScript sea más potente y más fácil de trabajar. Desde métodos de matriz mejorados hasta el manejo de mejor promesa, estas actualizaciones se tratan de hacer que su código sea más limpio y eficiente. A medida que JavaScript continúa creciendo y evolucionando, mantenerse actualizado con estos cambios asegura que siempre esté aprovechando al máximo el lenguaje.

Referencias:

1. tc39 propuestas
2. borrador ECMA-262
3. mdn