Saltar al contenido principal

@babel/plugin-transform-for-of

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 →

información

Este plugin está incluido en @babel/preset-env

Ejemplo​

Entrada

JavaScript
for (var i of foo) {
}

Salida

JavaScript
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;

try {
  for (
    var _iterator = foo[Symbol.iterator](), _step;
    !(_iteratorNormalCompletion = (_step = _iterator.next()).done);
    _iteratorNormalCompletion = true
  ) {
    var i = _step.value;
  }
} catch (err) {
  _didIteratorError = true;
  _iteratorError = err;
} finally {
  try {
    if (!_iteratorNormalCompletion && _iterator.return != null) {
      _iterator.return();
    }
  } finally {
    if (_didIteratorError) {
      throw _iteratorError;
    }
  }
}

Instalación​

npm install --save-dev @babel/plugin-transform-for-of

Uso​

Mediante un archivo de configuración (Recomendado)​

Sin opciones:

JavaScript
{
  "plugins": ["@babel/plugin-transform-for-of"]
}

Con opciones:

JavaScript
{
  "plugins": [
    ["@babel/plugin-transform-for-of", {
      "loose": true, // defaults to false
      "assumeArray": true // defaults to false
    }]
  ]
}

Mediante la CLI​

Shell
babel --plugins @babel/plugin-transform-for-of script.js

Mediante la API de Node​

JavaScript
require("@babel/core").transformSync("code", {
  plugins: ["@babel/plugin-transform-for-of"],
});

Opciones​

loose​

boolean, valor predeterminado: false

En modo loose, los arrays se optimizan mediante una ruta rápida, mejorando significativamente el rendimiento.

precaución

Considera migrar al supuesto de nivel superior skipForOfIteratorClosing.

babel.config.json
{
  "assumptions": {
    "skipForOfIteratorClosing": true
  }
}

Todos los demás iterables continuarán funcionando correctamente.

Ejemplo​

Entrada

JavaScript
for (var i of foo) {
}

Salida

JavaScript
for (
  var _iterator = foo,
    _isArray = Array.isArray(_iterator),
    _i = 0,
    _iterator = _isArray ? _iterator : _iterator[Symbol.iterator]();
  ;

) {
  var _ref;

  if (_isArray) {
    if (_i >= _iterator.length) break;
    _ref = _iterator[_i++];
  } else {
    _i = _iterator.next();
    if (_i.done) break;
    _ref = _i.value;
  }

  var i = _ref;
}

Finalizaciones abruptas​

Bajo el supuesto skipForOfIteratorClosing, el método return de un iterador no se llamará en finalizaciones abruptas causadas por errores lanzados.

Consulta google/traceur-compiler#1773 y babel/babel#838 para más información.

allowArrayLike​

boolean, valor predeterminado: false

Añadido en: v7.10.0

Esta opción permite usar for-of con objetos tipo array.

Un objeto tipo array es un objeto con propiedad length: por ejemplo, { 0: "a", 1: "b", length: 2 }. Nota que, como los arrays reales, estos objetos pueden tener "huecos": { 1: "a", length: 3 } equivale a [ (hole), "a", (hole) ].

Aunque no es compatible con la especificación iterar objetos tipo array como si fueran arrays, existen muchos objetos que serían iterables en navegadores modernos con soporte para Symbol.iterator. Algunos ejemplos destacados son las colecciones DOM, como document.querySelectorAll("img.big"), que son el principal caso de uso para esta opción.

Ten en cuenta que Babel permite iterar arguments en motores antiguos incluso con esta opción desactivada, ya que está definido como iterable en la especificación ECMAScript.

assumeArray​

boolean, valor predeterminado: false

Aplica la optimización mostrada abajo a todos los bucles for-of asumiendo que todos los bucles son arrays.

Puede ser útil cuando simplemente quieres que un bucle for-of represente un bucle for básico sobre un array.

Optimización​

Si se usa un array básico, Babel compilará el bucle for-of como un bucle for regular.

Entrada

JavaScript
for (let a of [1, 2, 3]) {
}

Salida

JavaScript
var _arr = [1, 2, 3];
for (var _i = 0; _i < _arr.length; _i++) {
  var a = _arr[_i];
}
consejo

Puedes leer más sobre cómo configurar opciones de plugins aquí