babel-plugin-transform-private
v0.1.3
Published
This is a plugin provide private fields in ES6+ class. It's not like [ECMAScript Private Fields](https://github.com/tc39/proposal-private-fields) proposal but automatically transform any field which starts with '_' into a private field.
Downloads
28
Readme
Babel Private Field Plugin
This is a plugin provide private fields in ES6+ class. It's not like ECMAScript Private Fields proposal but automatically transform any field which starts with '_' into a private field.
Usage
npm i babel-plugin-transform-private --save-dev
Config .babelrc
or package.json
{
"plugins": [
["transform-private", {
"pattern": "^_"
}],
]
}
Compile results:
Simple class
input:
export default class Point2D{
constructor(x, y){
this._x = x;
this._y = y;
}
get XY(){
return [this._x, this._y];
}
get length(){
return Math.sqrt(this._x * this._x + this._y * this._y);
}
}
output:
const Point2D = function () {
const [$_x$, $_y$] = [Symbol("$_x$"), Symbol("$_y$")];
class Point2D {
constructor(x, y) {
this[$_x$] = x;
this[$_y$] = y;
}
get XY() {
return [this[$_x$], this[$_y$]];
}
get length() {
return Math.sqrt(this[$_x$] * this[$_x$] + this[$_y$] * this[$_y$]);
}
}
return Point2D;
}();
export default Point2D;
Nested class
input:
export default class Outer {
constructor(){
this._inner = class Inner{
constructor(x){
this._x = x;
}
get X(){
return this._x;
}
}
}
get innerCls(){
return this._inner;
}
}
output:
const Outer = function () {
const [$_inner$] = [Symbol("$_inner$")];
class Outer {
constructor() {
this[$_inner$] = function () {
const [$_x$] = [Symbol("$_x$")];
return class Inner {
constructor(x) {
this[$_x$] = x;
}
get X() {
return this[$_x$];
}
};
}();
}
get innerCls() {
return this[$_inner$];
}
}
return Outer;
}();
export default Outer;
Protected fields & super
A method or a getter starts with '_' will be transforme to protected field. That means it can be accessed using super
keyword.
input:
export const Foo = class {
constructor(x, y){
this._x = x;
this._y = y;
this._zz = x + y;
}
//protected filed
get _z(){
return this._zz;
}
}
export const Bar = class extends Foo{
constructor(x, y){
super(x * 2, y * 3);
}
get z(){
return super._z; //get x*2+y*3
}
get z2(){
return super._zz; //undefined
}
}
output:
export const Foo = function () {
const [$_x$, $_y$, $_zz$, $_z$] = [Symbol("$_x$"), Symbol("$_y$"), Symbol("$_zz$"), Symbol("$_z$")];
return class {
constructor(x, y) {
this[$_x$] = x;
this[$_y$] = y;
this[$_zz$] = x + y;
}
get [$_z$]() {
return this[$_zz$];
}
};
}();
export const Bar = class extends Foo {
constructor(x, y) {
super(x * 2, y * 3);
}
get z() {
return super[Object.getOwnPropertySymbols(this.__proto__.__proto__).filter(s => String(s) === "Symbol($_z$)")[0]];
}
get z2() {
return super[Object.getOwnPropertySymbols(this.__proto__.__proto__).filter(s => String(s) === "Symbol($_zz$)")[0]];
}
};