diff options
| author | ruki <waruqi@gmail.com> | 2018-11-08 00:38:48 +0800 |
|---|---|---|
| committer | ruki <waruqi@gmail.com> | 2018-11-07 21:53:09 +0800 |
| commit | 26105034da4fcce7ac883c899d781f016559310d (patch) | |
| tree | c459a5dc4e3aa0972d9919033ece511ce76dd129 /node_modules/@babel/plugin-proposal-class-properties/README.md | |
| parent | 2c77f00f1a7ecb6c8192f9c16d3b2001b254a107 (diff) | |
| download | xmake-docs-26105034da4fcce7ac883c899d781f016559310d.tar.gz xmake-docs-26105034da4fcce7ac883c899d781f016559310d.zip | |
switch to vuepress
Diffstat (limited to 'node_modules/@babel/plugin-proposal-class-properties/README.md')
| -rw-r--r-- | node_modules/@babel/plugin-proposal-class-properties/README.md | 149 |
1 files changed, 149 insertions, 0 deletions
diff --git a/node_modules/@babel/plugin-proposal-class-properties/README.md b/node_modules/@babel/plugin-proposal-class-properties/README.md new file mode 100644 index 00000000..dee62c85 --- /dev/null +++ b/node_modules/@babel/plugin-proposal-class-properties/README.md @@ -0,0 +1,149 @@ +# @babel/plugin-proposal-class-properties + +> This plugin transforms class properties + +## Example + +Below is a class with four class properties which will be transformed. + +```js + class Bork { + //Property initializer syntax + instanceProperty = "bork"; + boundFunction = () => { + return this.instanceProperty; + }; + + //Static class properties + static staticProperty = "babelIsCool"; + static staticFunction = function() { + return Bork.staticProperty; + }; + } + + let myBork = new Bork; + + //Property initializers are not on the prototype. + console.log(myBork.__proto__.boundFunction); // > undefined + + //Bound functions are bound to the class instance. + console.log(myBork.boundFunction.call(undefined)); // > "bork" + + //Static function exists on the class. + console.log(Bork.staticFunction()); // > "babelIsCool" +``` + + +## Installation + +```sh +npm install --save-dev @babel/plugin-proposal-class-properties +``` + +## Usage + +### Via `.babelrc` (Recommended) + +**.babelrc** + +Without options: + +```json +{ + "plugins": ["@babel/plugin-proposal-class-properties"] +} +``` + +With options: + +```json +{ + "plugins": [ + ["@babel/plugin-proposal-class-properties", { "loose": true }] + ] +} +``` + +### Via CLI + +```sh +babel --plugins @babel/plugin-proposal-class-properties script.js +``` + +### Via Node API + +```javascript +require("@babel/core").transform("code", { + plugins: ["@babel/plugin-proposal-class-properties"] +}); +``` + +## Options + +### `loose` + +`boolean`, defaults to `false`. + +When `true`, class properties are compiled to use an assignment expression instead of `Object.defineProperty`. + +#### Example + +```js + class Bork { + static a = 'foo'; + static b; + + x = 'bar'; + y; + } +``` + +Without `{ "loose": true }`, the above code will compile to the following, using `Object.defineProperty`: + +```js +var Bork = function Bork() { + babelHelpers.classCallCheck(this, Bork); + Object.defineProperty(this, "x", { + configurable: true, + enumerable: true, + writable: true, + value: 'bar' + }); + Object.defineProperty(this, "y", { + configurable: true, + enumerable: true, + writable: true, + value: void 0 + }); +}; + +Object.defineProperty(Bork, "a", { + configurable: true, + enumerable: true, + writable: true, + value: 'foo' +}); +Object.defineProperty(Bork, "b", { + configurable: true, + enumerable: true, + writable: true, + value: void 0 +}); +``` + +However, with `{ "loose": true }`, it will compile using assignment expressions: + +```js +var Bork = function Bork() { + babelHelpers.classCallCheck(this, Bork); + this.x = 'bar'; + this.y = void 0; +}; + +Bork.a = 'foo'; +Bork.b = void 0; +``` + +## References + +* [Proposal: ES Class Fields & Static Properties](https://github.com/jeffmo/es-class-static-properties-and-fields) |
