Saltar al contenido principal

@babel/plugin-transform-computed-properties

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
var obj = {
  ["x" + foo]: "heh",
  ["y" + bar]: "noo",
  foo: "foo",
  bar: "bar",
};

Salida

JavaScript
var _obj;

function _defineProperty(obj, key, value) {
  if (key in obj) {
    Object.defineProperty(obj, key, {
      value: value,
      enumerable: true,
      configurable: true,
      writable: true,
    });
  } else {
    obj[key] = value;
  }

  return obj;
}

var obj = ((_obj = {}),
_defineProperty(_obj, "x" + foo, "heh"),
_defineProperty(_obj, "y" + bar, "noo"),
_defineProperty(_obj, "foo", "foo"),
_defineProperty(_obj, "bar", "bar"),
_obj);

Instalación​

npm install --save-dev @babel/plugin-transform-computed-properties

Uso​

Mediante un archivo de configuración (Recomendado)​

Sin opciones:

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

Con opciones:

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

Mediante la CLI​

Shell
babel --plugins @babel/plugin-transform-computed-properties script.js

Mediante la API de Node​

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

Opciones​

loose​

boolean, valor predeterminado: false

Al igual que la asignación de métodos en clases, en modo loose los nombres de propiedades computadas utilizan asignaciones simples en lugar de ser definidas. Es poco probable que esto cause problemas en código de producción.

precaución

Considera migrar al supuesto de alto nivel setComputedProperties.

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

Ejemplo​

Entrada

JavaScript
var obj = {
  ["x" + foo]: "heh",
  ["y" + bar]: "noo",
  foo: "foo",
  bar: "bar",
};

Salida

Cuando setComputedProperties es true.

JavaScript
var _obj;

var obj = ((_obj = {}),
(_obj["x" + foo] = "heh"),
(_obj["y" + bar] = "noo"),
(_obj.foo = "foo"),
(_obj.bar = "bar"),
_obj);

Cuando setComputedProperties es false.

JavaScript
import _defineProperty from "@babel/runtime/helpers/defineProperty";

var _obj;

var obj = ((_obj = {}),
_defineProperty(_obj, "x" + foo, "heh"),
_defineProperty(_obj, "y" + bar, "noo"),
_defineProperty(_obj, "foo", "foo"),
_defineProperty(_obj, "bar", "bar"),
_obj);
consejo

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