Saltar al contenido principal

7.18.0 Publicado: Desestructuración de elementos privados y TypeScript 4.7

· 4 min de lectura
Babel Team
Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

¡Acabamos de publicar Babel 7.18.0!

Esta versión incluye soporte para la propuesta de desestructuración privada y para TypeScript 4.7.

Puedes leer el registro de cambios completo en GitHub.

Si tú o tu empresa quieren apoyar a Babel y la evolución de JavaScript, pero no están seguros de cómo, pueden donarnos en nuestro Open Collective y, aún mejor, trabajar directamente con nosotros en la implementación de nuevas propuestas de ECMAScript! Como proyecto impulsado por voluntarios, dependemos del apoyo de la comunidad para financiar nuestros esfuerzos en dar soporte a la amplia variedad de usuarios de JavaScript. ¡Contáctanos en team@babeljs.io si quieres conversar más!

Destacados​

Desestructuración privada (#14304)​

Babel ahora soporta transformar la propuesta de desestructuración privada. Ya puedes usar campos o métodos privados en patrones de desestructuración:

InputOutput
JavaScript
class Foo {
  #x = 0;
  y = 0;

  equals(obj) {
    const { #x: x, y: y } = this;

    return (
      x === obj.#x && y === obj.y
    );
  }
}

JavaScript
class Foo {
  #x = 0;
  y = 0;

  equals(obj) {
    const x = this.#x,
      { y } = this;

    return (
      x === obj.#x && y === obj.y
    );
  }
}

Puedes activarlo añadiendo el plugin @babel/plugin-proposal-destructuring-private a tu configuración.

Para minimizar la huella de transpilación, el código generado por este plugin aún requiere soporte para desestructuración no privada y elementos privados. Si necesitas compilarlos más, activa los plugins relevantes (o usa @babel/preset-env).

Soporte para TypeScript 4.7 (#14359, #14457, #14476)​

TypeScript 4.7 introduce varias nuevas características sintácticas:

  • Expresiones de instanciación, que permiten especificar argumentos de tipo en funciones sin invocarlas:

    const identity = <T>(val: T) => val;

    const stringIdentity = identity<string>; // (val: string) => string;

  • Anotaciones de varianza explícitas para argumentos de tipo, que guían al comprobador de tipos de TypeScript al calcular compatibilidad entre tipos:

    type Provider<out T> = () => T;
    type Consumer<in T> = (x: T) => void;
    type Mapper<in T, out U> = (x: T) => U;
    type Processor<in out T> = (x: T) => T;

    En este ejemplo, Provide<string> es un subtipo de Provider<string | number> mientras que Consumer<string | number> es un subtipo de Consumer<string>.

  • Restricciones para el operador infer en tipos condicionales:

    type GetColor<T> =
      T extends { color: infer C extends "red" | "pink" }
        ? C
        : "unknown color";

Puedes leer el anuncio completo de TypeScript 4.7 en su blog.

Helper regenerator-runtime en línea (#14538)​

A partir de Babel 7.18.0, regenerator-runtime se inyecta automáticamente de la misma forma que Babel inyecta otros helpers de tiempo de ejecución, sin depender de un global implícito regeneratorRuntime. Cuando no se usa @babel/plugin-transform-runtime, Babel incluirá automáticamente el helper regeneratorRuntime:

  • ya no es necesario cargar manualmente regenerator-runtime (con import, require o <script>);

  • puedes eliminar "regenerator-runtime" de tus dependencias en package.json.

Por ejemplo, esta es la diferencia en la salida entre versiones antiguas y nuevas de Babel al compilar var f = function*() {};:

+function _regeneratorRuntime() { /* ... */ }

-var f = /*#__PURE__*/regeneratorRuntime.mark(function f() {
+var f = /*#__PURE__*/_regeneratorRuntime().mark(function f() {
-  return regeneratorRuntime.wrap(function f$(_context) {
+  return _regeneratorRuntime().wrap(function f$(_context) {
     while (1) {
       switch (_context.prev = _context.next) {
         case 0:
         case "end":
           return _context.stop();
       }
     }
   }, f);
 });