ES 5シミュレーションES 6のSymbolプライベートメンバ機能例


この実例は、ES 5シミュレーションES 6のSymbolがプライベートメンバ機能を実現することを述べている。皆さんに参考にしてあげます。具体的には以下の通りです。
ES 6には文法があり、定義類が簡単になりました。

class Person {
  constructor(name) {
    this._name = name;
  }
  
  get name() {
    return this._name;
  }
}
しかし、プライベート属性は提供されていません。例えば上のPersonは構造の時にnameに入ることを望んでいます。その後は修正が許されません。しかし、私有属性がないので、こうする人がいます。

Person james = new Person("James");
james._name = "Tom";    // God Save Me
しかし、プライベートメンバーを定義したいならば、広く伝えられるSymbol大法など、融通のきく方法もあります。

var Person = (function() {
  let _name = Symbol();
  class Person {
    constructor(name) {
      this[_name] = name;
    }
    
    get name() {
      return this[_name];
    }
  }
  return Person;
})();
その本質は、匿名関数内のSymbolのインスタンス_nameが、外部ではアクセスできないローカル変数であることにある。Symbolは自分の唯一性の特徴で、もう一つ同じものを作ることができないので、プライベートメンバーを模擬しました。
このような考え方では、ES 5においてもプライベートメンバーのシミュレーションが容易である。局所変数は容易にできます。関数範囲内ではletvarは同じ効果です。問題はSymbolをシミュレートする唯一性にある。
ES 5はSybimolを持っていません。属性名は文字列だけかもしれません。もしこの文字列が予測できないなら、基本的に目標を達成します。予想できないようにするには、乱数は基本的に解決されます。

var Person = (function() {
  var _name = "00" + Math.random();
  function Person(name) {
    this[_name] = name;
  }
  
  Object.defineProperty(Person.prototype, "name", {
    get: function() {
      return this[_name];
    }
  });

  return Person;
})();
このプログラムがWebページにロードされると、リフレッシュページ_nameの値は異なりますが、プログラムの論理には影響しません。外部プログラムには何の違和感もありません。
しかし、Symbol案と比較して、この_nameの値はSymbolのように隠れないことが問題です。コンソールでは多くの方法でそれを探し出すことができます。開発段階ではこの値はまだ予想できない。
個々のプライベート属性の場合、ある人はプライベートKeyの法則を見つけることができます。たとえば、上のプライベートKeyは"000."から始まります。オブジェクト属性を遍歴して探しやすいです。複数のプライベートKeyの場合、いくつかの技術的手段を通じて探すこともできます。

function getPersonNameKey() {
  var v = "" + Math.random();
  var p = new Person(v);
  for (var k in p) {
    if (p[k] === v) {
      return k;
    }
  }
}
しかし、これらは全部後の話です。あまりにも大変です。普通の人はこのようにしません。ましてSymbolも遍歴可能であり(Object.getOwnPropertySymbols()を通じて)、完全に同じ方法でプライベートKeyを取得することができる。
以上より、ES 5においてSymbolをシミュレートしてプライベート属性を実現する目的が達成されました。
興味のある友達はオンラインHTML/CSS/JavaScriptコードを使ってツールを実行できます。http://tools.jb51.net/code/HtmlJsRun上記コードの運行効果をテストします。
もっと多くのJavaScriptに関する内容に興味がある読者は、当駅のテーマを見ることができます。「javascript対象向け入門教程」、「JavaScriptエラーとデバッグテクニックのまとめ」、「JavaScriptデータ構造とアルゴリズム技術のまとめ」、「JavaScriptはアルゴリズムと技術の総括を遍歴します。」および「JavaScript数学演算の使い方のまとめ
本論文で述べたように、JavaScriptプログラムの設計に役に立ちます。