Aller au contenu principal

@babel/plugin-transform-private-methods

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, dans ES2022

History
VersionChanges
v7.3.0Support private accessors (getters and setters)
v7.2.0Initial Release

Exemple​

JavaScript
class Counter extends HTMLElement {
  #xValue = 0;

  get #x() {
    return this.#xValue;
  }
  set #x(value) {
    this.#xValue = value;
    window.requestAnimationFrame(this.#render.bind(this));
  }

  #clicked() {
    this.#x++;
  }
}

Installation​

npm install @babel/plugin-transform-private-methods --save-dev

Utilisation​

Avec un fichier de configuration (Recommandé)​

Sans options :

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

Avec options :

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

Via CLI​

Shell
$ babel --plugins @babel/plugin-transform-private-methods script.js

Via l'API Node​

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

Options​

loose​

boolean, valeur par défaut : false.

note

Le paramètre de configuration loose doit être identique à celui de @babel/plugin-transform-class-properties.

Lorsque true, les méthodes privées seront assignées directement sur leur parent via Object.defineProperty plutôt qu'un WeakSet. Cela améliore les performances et le débogage (accès normal aux propriétés vs .get()) au détriment d'une possible fuite des "privés" via des méthodes comme Object.getOwnPropertyNames.

attention

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

babel.config.json
{
  "assumptions": {
    "privateFieldsAsProperties": true,
    "setPublicClassFields": true
  }
}

Notez que privateFieldsAsProperties et setPublicClassFields doivent tous deux être définis sur true.

Utilisons l'exemple suivant :

JavaScript
class Foo {
  constructor() {
    this.publicField = this.#privateMethod();
  }

  #privateMethod() {
    return 42;
  }
}

Par défaut, cela devient :

JavaScript
var Foo = function Foo() {
  "use strict";

  babelHelpers.classCallCheck(this, Foo);

  _privateMethod.add(this);

  this.publicField = babelHelpers
    .classPrivateMethodGet(this, _privateMethod, _privateMethod2)
    .call(this);
};

var _privateMethod = new WeakSet();

var _privateMethod2 = function _privateMethod2() {
  return 42;
};

Avec { privateFieldsAsProperties: true }, cela devient :

JavaScript
var Foo = function Foo() {
  "use strict";

  babelHelpers.classCallCheck(this, Foo);
  Object.defineProperty(this, _privateMethod, {
    value: _privateMethod2,
  });
  this.publicField = babelHelpers
    .classPrivateFieldLooseBase(this, _privateMethod)
    [_privateMethod]();
};

var _privateMethod = babelHelpers.classPrivateFieldLooseKey("privateMethod");

var _privateMethod2 = function _privateMethod2() {
  return 42;
};
astuce

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

Références​