Aller au contenu principal

@babel/plugin-transform-spread

Traduction Bêta Non Officielle

Cette page a été traduite par PageTurner AI (bêta). Non approuvée officiellement par le projet. Vous avez trouvé une erreur ? Signaler un problème →

info

Ce plugin est inclus dans @babel/preset-env

Exemple​

Entrée

JavaScript
var a = ["a", "b", "c"];

var b = [...a, "foo"];

var c = foo(...a);

Sortie

JavaScript
var a = ["a", "b", "c"];

var b = a.concat(["foo"]);

var c = foo.apply(void 0, a);

Installation​

npm install --save-dev @babel/plugin-transform-spread

Utilisation​

Avec un fichier de configuration (Recommandé)​

Sans options :

babel.config.json
{
  "plugins": ["@babel/plugin-transform-spread"]
}

Avec options :

babel.config.json
{
  "plugins": [
    [
      "@babel/plugin-transform-spread",
      {
        "loose": true
      }
    ]
  ]
}

Via CLI​

Shell
babel --plugins @babel/plugin-transform-spread script.js

Via l'API Node​

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

Options​

loose​

boolean, valeur par défaut : false.

En mode loose, tous les itérables sont considérés comme des tableaux.

attention

Envisagez de migrer vers l'hypothèse de haut niveau iterableIsArray.

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

Sous l'hypothèse iterableIsArray, Babel préserve les "trous" lors de la décomposition d'un tableau (par exemple, [ ...Array(2) ] produit [ (hole), (hole) ]). Définissez iterableIsArray sur false pour éviter ce comportement.

astuce

Vous pouvez en savoir plus sur la configuration des options de plugin ici

allowArrayLike​

boolean, valeur par défaut : false

Ajouté dans : v7.10.0

Cette option permet de décomposer des objets semblables à des tableaux comme s'ils étaient des tableaux.

attention

Envisagez de migrer vers l'hypothèse de haut niveau arrayLikeIsIterable.

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

Un objet semblable à un tableau est un objet possédant une propriété length : par exemple, { 0: "a", 1: "b", length: 2 }. Notez que, comme les vrais tableaux, ces objets peuvent avoir des "trous" : { 1: "a", length: 3 } est équivalent à [ (hole), "a", (hole) ].

Bien que décomposer des objets semblables à des tableaux comme des tableaux ne soit pas conforme aux spécifications, de nombreux objets seraient des itérables dans les navigateurs modernes avec le support de Symbol.iterator. Parmi les exemples notables figurent les collections DOM, comme document.querySelectorAll("img.big"), qui constituent le principal cas d'usage de cette option.

Notez que Babel permet de décomposer arguments dans les anciens moteurs même si cette option est désactivée, car il est défini comme itérable dans la spécification ECMAScript.

Références​