Vai al contenuto principale

@babel/plugin-transform-for-of

Traduzione Beta Non Ufficiale

Questa pagina è stata tradotta da PageTurner AI (beta). Non ufficialmente approvata dal progetto. Hai trovato un errore? Segnala problema →

informazioni

Questo plugin è incluso in @babel/preset-env

Esempio​

In

JavaScript
for (var i of foo) {
}

Out

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;
    }
  }
}

Installazione​

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

Utilizzo​

Con un file di configurazione (Consigliato)​

Senza opzioni:

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

Con opzioni:

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

Tramite CLI​

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

Tramite Node API​

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

Opzioni​

loose​

boolean, predefinito false

In modalità loose, gli array vengono inseriti in un percorso ottimizzato, aumentando significativamente le prestazioni.

attenzione

Considera di migrare all'assunzione di primo livello skipForOfIteratorClosing.

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

Tutti gli altri iterabili continueranno a funzionare correttamente.

Esempio​

In

JavaScript
for (var i of foo) {
}

Out

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;
}

Completamenti anomali​

Sotto l'assunzione skipForOfIteratorClosing, il metodo return di un iteratore non verrà chiamato in caso di completamenti anomali causati da errori lanciati.

Per maggiori informazioni, consulta google/traceur-compiler#1773 e babel/babel#838.

allowArrayLike​

boolean, predefinito false

Aggiunto in: v7.10.0

Questa opzione consente di utilizzare il ciclo for-of con oggetti array-like.

Un oggetto array-like è un oggetto con una proprietà length: ad esempio { 0: "a", 1: "b", length: 2 }. Nota che, come gli array veri, gli oggetti array-like possono avere "buchi": { 1: "a", length: 3 } equivale a [ (hole), "a", (hole) ].

Sebbene non sia conforme alle specifiche iterare oggetti array-like come se fossero array, molti oggetti sarebbero iterabili nei browser moderni con supporto a Symbol.iterator. Alcuni esempi notevoli sono le collezioni DOM, come document.querySelectorAll("img.big"), che rappresentano il caso d'uso principale per questa opzione.

Nota che Babel consente di iterare arguments nei motori legacy anche quando questa opzione è disabilitata, poiché è definito come iterabile nella specifica ECMAScript.

assumeArray​

boolean, predefinito false

Applica l'ottimizzazione descritta di seguito a tutti i cicli for-of assumendo che tutti siano array.

Utile quando si desidera che un ciclo for-of rappresenti un semplice ciclo for su un array.

Ottimizzazione​

Se viene utilizzato un array semplice, Babel compilerà il ciclo for-of in un normale ciclo for.

In

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

Out

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

Maggiori informazioni sulla configurazione delle opzioni del plugin sono disponibili qui