跳至主内容

@babel/plugin-transform-spread

非官方测试版翻译

本页面由 PageTurner AI 翻译（测试版）。未经项目官方认可。 发现错误？ 报告问题 →

信息

此插件已包含在 @babel/preset-env 中

示例​

输入

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

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

var c = foo(...a);

输出

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

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

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

安装​

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

用法​

通过配置文件（推荐）​

无配置选项时：

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

使用配置选项时：

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

通过命令行​

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

通过 Node API​

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

配置选项​

loose​

boolean，默认值 false

在宽松模式下，所有可迭代对象均被视为数组。

注意

请考虑迁移到顶层的 iterableIsArray 假设。

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

在 iterableIsArray 假设下，当展开数组时 Babel 会保留"空位"(holes)（例如 [ ...Array(2) ] 会生成 [ (hole), (hole) ]）。将 iterableIsArray 设为 false 可避免此行为。

提示

你可以在此处阅读更多关于配置插件选项的信息。

allowArrayLike​

boolean，默认值 false

添加于：v7.10.0

此选项允许像展开数组一样展开类数组对象。

注意

请考虑迁移到顶层的 arrayLikeIsIterable 假设。

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

类数组对象是具有 length 属性的对象：例如 { 0: "a", 1: "b", length: 2 }。请注意，与真实数组类似，类数组对象可能存在"空位"(holes)：{ 1: "a", length: 3 } 等价于 [ (hole), "a", (hole) ]。

虽然将类数组对象像数组一样展开并不符合规范，但现代浏览器中许多支持 Symbol.iterator 的对象实际上是可迭代对象。典型的例子如 DOM 集合（例如 document.querySelectorAll("img.big")），这也是此选项的主要使用场景。

请注意，即使禁用此选项，Babel 仍允许在旧引擎中展开 arguments 对象，因为它在 ECMAScript 规范中被定义为可迭代对象。

参考​