codecamp

@babel/plugin-proposal-private-property-in-object

NOTE: This plugin is included in @babel/preset-env, in ES2022

Example

In

JavaScript

class Foo {
#bar = "bar";

test(obj) {
return #bar in obj;
}
}

Out

JavaScript

class Foo {
constructor() {
_bar.set(this, {
writable: true,
value: "bar",
});
}

test() {
return _bar.has(this);
}
}

var _bar = new WeakMap();

Installation

  • npm
  • Yarn
  • pnpm
pnpm add --save-dev @babel/plugin-proposal-private-property-in-object

Usage

With a configuration file (Recommended)

babel.config.json

{
"plugins": ["@babel/plugin-proposal-private-property-in-object"]
}

Via CLI

Shell

babel --plugins @babel/plugin-proposal-private-property-in-object

Via Node API

JavaScript

require("@babel/core").transformSync("code", {
plugins: ["@babel/plugin-proposal-private-property-in-object"],
});

Options

loose

boolean, defaults to false.

Note: The loose mode configuration setting must be the same as @babel/proposal-class-properties.

When true, private property in expressions will check own properties (as opposed to inherited ones) on the object, instead of checking for presence inside a WeakSet. This results in improved performance and debugging (normal property access vs .get()) at the expense of potentially leaking "privates" via things like Object.getOwnPropertyNames.

⚠️ Consider migrating to the top level privateFieldsAsProperties assumption.

babel.config.json

{
"assumptions": {
"privateFieldsAsProperties": true,
"setPublicClassFields": true
}
}

Note that both privateFieldsAsProperties and setPublicClassFields must be set to true.

Example

In

JavaScript

class Foo {
#bar = "bar";

test(obj) {
return #bar in obj;
}
}

Out

JavaScript

class Foo {
constructor() {
Object.defineProperty(this, _bar, {
writable: true,
value: "bar",
});
}

test() {
return Object.prototype.hasOwnProperty.call(this, _bar);
}
}

var _bar = babelHelpers.classPrivateFieldLooseKey("bar");
You can read more about configuring plugin options here

References


@babel/plugin-proposal-private-methods
@babel/plugin-syntax-top-level-await
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

Babel 杂项

Babel 工具软件包

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }