[JavaScript]prvate field&weak map

1.背景
prvate fieldsはtc 39 stage 3の提案で、

class T {
  #x = 0;

  addOne(){
    return ++this.#x;
  }
}

const t = new T;
Reflect.ownKeys(t);  // []

prvate fieldsは#号で始まります.例えば、上記のコードのうち、#xはprvate fieldsです.Reflect.ownKeysを使ってインスタンスtのすべての属性名を取得します.結果は空のリストです.
注:

v = {};

//      
v['a'] = 1;

//       
Object.defineProperty(v, 'b', {
  value: 2,
  enumerable: false,
});

// Symbol  
s = Symbol('c');
v[s] = 3;

Object.keys(v);  // ['a']
Object.getOwnPropertyNames(v);  // ['a', 'b']
Object.getOwnPropertySymbols(v);  // [Symbol(c)]
Reflect.ownKeys(v);  // ["a", "b", Symbol(c)]

(1)Object.keysは、オブジェクト自体のエニュメレート・属性を取得します.(2)Object.getOwn PropertyNamesは、オブジェクト自体のエニュメレーション属性とエニュメレーション属性を取得します.(3)Reflect.ownKeysは、オブジェクト自体のエニュメレーション属性を取得します.属性とSymbol属性は列挙できません.
2.バベルでコンパイルする
babelはv 7.0.0-beta.48から、prvate fieldsに対するサポートを追加しました.上のコードをコンパイルして、コンパイル結果を確認してください.
(1)グローバルインストール@babel/cliと@babel/core、バージョンを指定します.

$ npm i -g @babel/[email protected] @babel/[email protected]
$ babel --version
> 7.0.0-beta.48 (@babel/core 7.0.0-beta.48)

(2)npm項目を新規作成し、初期化する

$ mkdir test-private-field
$ cd test-private-field
$ npm init

(3).babelrcファイルの新規作成

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-stage-3"
  ]
}

(4)設置開発環境依存

$ npm i -D \
@babel/[email protected] \
@babel/[email protected] \
@babel/[email protected]

(5)ソースコードindex.js

class T {
  #x = 0;

  addOne(){
    return ++this.#x;
  }
}

const t = new T;
Reflect.ownKeys(t);  // []

(6)バベルコンパイルを使ってdist.jsに出力する.

$ babel index.js > dist.js

(7)コンパイルの結果は以下の通りです.

"use strict";

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }

function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }

function _classPrivateFieldSet(receiver, privateMap, value) { if (!privateMap.has(receiver)) { throw new TypeError("attempted to set private field on non-instance"); } privateMap.set(receiver, value); return value; }

function _classPrivateFieldGet(receiver, privateMap) { if (!privateMap.has(receiver)) { throw new TypeError("attempted to get private field on non-instance"); } return privateMap.get(receiver); }

var T =
/*#__PURE__*/
function () {
  function T() {
    _classCallCheck(this, T);

    _x.set(this, 0);
  }

  _createClass(T, [{
    key: "addOne",
    value: function addOne() {
      return _classPrivateFieldSet(this, _x, +_classPrivateFieldGet(this, _x) + 1);
    }
  }]);

  return T;
}();

var _x = new WeakMap();

var t = new T();
Reflect.ownKeys(t); // []

私たちはprvate fieldsを見ました.WeakMapで実現しました.
3.WeakMap
WeakMapはECMAScript 2015の特性です.Mapとは違います.(1)WeakMapのキーはオブジェクトでなければなりません.(2)そしてWeakMapは自身のキーに弱い参照です.
弱引用とは、WeakMapキーの対象として、他の対象がないとキーペアが無効になり、ゴミとして回収されます.
WeakMapのこの特性のため、私達はそれを使ってprvate fieldsを実現することができます.

const weakMap = new WeakMap;
class T {
  constructor(){
    weakMap.set(this, {
      x: 0,
    });
  }

  addOne(){
    const fields = weakMap.get(this);
    return ++fields.x;
  }
}

const t = new T;
Reflect.ownKeys(t);  // []

以上のコードでは、Tの例を作成するたびに、キーペアがweakMapに追加され、キーは、現在作成されているTの例tであり、この例が持つprvate fieldsの値である.Tの例tが他のオブジェクトに参照されない場合、キーペアは自動的に回収され、Mapを使用する場合は手動で回収される必要がある.
参照
MDN:Reflect.ownKeys MDN:Object.getOwn PropertySymbors babel:v 7.0.0-beta.48MDN:WeakMap