JavaScript でプライベート変数を宣言する 2 つの方法

序文

JavaScript は、キーワードを使用してプライベート変数を宣言できる他の言語とは異なります。
JavaScript でプライベート変数を宣言する方法は 2 つあります。1 つはクロージャを使用する方法で、もう 1 つは WeakMap を使用する方法です。

閉鎖

クロージャを記述する方法は多数あります。たとえば、次のようになります。
他の関数のスコープにアクセスできる関数。
内部関数が外部関数スコープにアクセスするためのブリッジ。
......

クロージャを使用してプライベート変数を構築するロジックは次のとおりです。
1. 外部関数内で変数と内部関数を宣言します。
2. 内部関数を使用して変数の値にアクセスしたり、変数の値を変更したりします。
3. 外側の関数で内側の関数を返します。

関数の外側(){
	val = 123 とします。
	関数内部(){
		戻り値:
	}
	中に戻る;
}
console.log(外部()());//123

上記の例は、クロージャを使用してプライベート変数を構築するロジックの概要を示していますが、プライベート変数の重要性を反映するには十分ではありません。const 変数でも上記のコードの効果を実現できます。

// 同じものにアクセスすることはできますが、変更することはできません。上記のコードの効果が得られます。const val = 123;
コンソール.log(val);//123

次のコードは、プライベート変数の重要性を具体的に反映しています。

関数 person(){ 
 _name = '不明' とします。
 _age = 18 とします。
 _sex = 'man' とします。

 関数setName(名前){
  _name = 名前 || '不明';
 }

 関数 getName(){
  _name を返します。
 }

 関数setAge(年齢){
  if(typeof age === 'number'){
   _age = Math.floor(年齢);
  }それ以外{
   エラーをスローします("typeof age !== 'number'");
  }
 }

 関数 getAge(){
  _age を返します。
 }

 関数setSex(性別){
  if(性別 === '男性' || 性別 === 1){
   _sex = '男性';
  }そうでない場合(性別 === '女性' || 性別 === 0){
   _sex = '女性';
  }それ以外{
   Error('入力エラー')をスローします。
  }
 }

 関数 getSex(){
  _sex を返します。
 }

 戻る {
  setName: setName、
  取得名: 取得名、
  年齢設定: 年齢設定、
  年齢取得: 年齢取得、
  セックスの設定: セックスの設定、
  ゲットセックス : ゲットセックス
 }
}

xiaoming = person() とします。
xiaohong = person() とします。
xiaoming.setName('xiaoming');
xiaohong.setName('xiaohong');
console.log('xiaoming 名: ' + xiaoming.getName());//xiaoming 名: xiaoming
console.log('xiaohong name : ' + xiaohong.getName());//xiaohong name : xiaohong

xiaoming.setAge(19.3333);
xiaohong.setAge('16');//キャッチされないエラー: typeof age !== 'number'
console.log('xiaoming 年齢: ' + xiaoming.getAge());//xiaoming 年齢: 19
console.log('xiaohong 年齢: ' + xiaohong.getAge());//xiaohong 年齢: 18


xiaoming.setSex(1);
xiaohong.setSex('女性');
console.log('xiaoming sex : ' + xiaoming.getSex());//xiaoming sex : 男性
console.log('xiaohong sex : ' + xiaohong.getSex());//xiaohong sex : 女性

上記のコードから、_name、_age、_sex の 3 つの変数の値を設定または取得する場合は、setName、getName、setAge、getAge、setSex、getSex などの固定メソッドのみを使用でき、すべての setter メソッドでは、仮パラメータが判断されることがわかります。これは、オブジェクトに対するすべての操作が制御されることを意味し、弱い型付け言語としての JavaScript の悪影響がある程度緩和されます。

弱いマップ

WeakMap についてよく知らない場合は、まず WeakMap の詳細な紹介を読んでみてください。
ここでの重要な点は、WeakMap のキーは列挙可能ではないということです。

名前WeakMapを新しいWeakMap()にします。
ageWeakMap = new WeakMap(); とします。
sexWeakMap = new WeakMap(); とします。

関数 person(){
 _hash = Object.create(null); とします。
 nameWeakMap.set(_hash,'不明');
 ageWeakMap.set(_hash,18);
 sexWeakMap.set(_hash, '男性');
 関数setName(名前){
  nameWeakMap.set(_hash,name || '不明');
 }

 関数 getName(){
  nameWeakMap.get(_hash) を返します。
 }

 関数setAge(年齢){
  if(typeof age === 'number'){
   ageWeakMap.set(_hash,Math.floor(age));
  }それ以外{
   エラーをスローします("typeof age !== 'number'");
  }
 }

 関数 getAge(){
  ageWeakMap.get(_hash) を返します。
 }

 関数setSex(性別){
  if(性別 === '男性' || 性別 === 1){
   sexWeakMap.set(_hash, '男性');
  }そうでない場合(性別 === '女性' || 性別 === 0){
   sexWeakMap.set(_hash,'女性');
  }それ以外{
   Error('入力エラー')をスローします。
  }
 }

 関数 getSex(){
  sexWeakMap.get(_hash); を返します。
 }

 戻る {
  名前の設定:名前の設定、
  取得名: 取得名、
  年齢設定: 年齢設定、
  年齢取得: 年齢取得、
  セックスの設定: セックスの設定、
  ゲットセックス : ゲットセックス
 }
}

xiaoming = person() とします。
xiaohong = person() とします。
xiaoming.setName('xiaoming');
xiaohong.setName('xiaohong');
console.log('xiaoming 名: ' + xiaoming.getName());//xiaoming 名: xiaoming
console.log('xiaohong name : ' + xiaohong.getName());//xiaohong name : xiaohong

xiaoming.setAge(19.3333);
xiaohong.setAge('16');//キャッチされないエラー: typeof age !== 'number'
console.log('xiaoming 年齢: ' + xiaoming.getAge());//xiaoming 年齢: 19
console.log('xiaohong 年齢: ' + xiaohong.getAge());//xiaohong 年齢: 18


xiaoming.setSex(1);
xiaohong.setSex('女性');
console.log('xiaoming sex : ' + xiaoming.getSex());//xiaoming sex : 男性
console.log('xiaohong sex : ' + xiaohong.getSex());//xiaohong sex : 女性

プライベート変数を構築することでも同じ効果が得られます。ちなみに、WeakMap はクラス内のプライベート変数を構築するために使用されます。