JavaScript クロージャ - ブロックスコープとプライベート変数-jsチュートリアル-php.cn

JavaScript クロージャ - ブロックスコープとプライベート変数

黄舟

リリース： 2017-01-20 14:21:26

オリジナル

921 人が閲覧しました

ブロックレベルスコープ

ブロックレベルスコープとは、中括弧で囲まれたコードブロック内のスコープを指します。 JavaScript にはブロックスコープはありません。この概念を理解するために、次の例を見てください:

for(var i = 0;i < 10; i++){
  ......
}
alert(i); //结果会输出10

ログイン後にコピー

上記のコードでは、for ループで変数 i を定義しました。C++ や Java などのプログラミング言語では、ループの実行が終了した後、i が定義されます。 for ループ内の変数はすぐにガベージコレクションされます。しかし、JavaScript では、ループや何らかの判断が使用されるかどうかに関係なく、変数は常に存在します。出力結果から、for ループ終了後に出力される値が 10 であることがわかります。

ループや判定のためにグローバル環境で変数を使用する場合、その変数が関数内の変数に影響を与える可能性があるため、特別な場合を除いてグローバル変数は使用しないでください。グローバル変数は Access のスコープチェーンの先頭にあります。が最も遅いです。

スコープをブロックする解決策は、匿名関数を使用することです。以下のコードを見てみましょう。

(function(){
  for(var i = 0; i < 10; i++){
    ......
  }
})();
 
// 直接打印i值会报错：i没有定义
alert(i);
 
// i is not defined
function fn(){
  alert(i);
}
fn();

ログイン後にコピー

上記のコードでは、コードブロックを匿名関数に配置し、すぐに匿名関数を呼び出しました。匿名関数の後の括弧のペアに注目してください。これは、匿名関数の呼び出しを示しています。このスタイルの記述は多くの JavaScript プログラムで見られます。このとき、無名関数内の変数は使用後に再利用され、無名関数外からはこれらの変数にアクセスできません。

チーム開発を行う場合、同じ名前のグローバル変数を定義する必要がある場合があるため、開発中に次の習慣を身に付ける必要があります: グローバル変数のコードを匿名関数に入れ、すぐに匿名関数を呼び出す, このようにグローバル変数のコードも実行できますが、これらの変数は制御したいスコープ内で制御されます。

プライベート変数

以前にオブジェクトを定義したとき、オブジェクトのプロパティを設定するために this キーワードを使用しました。このように設定されたプロパティはパブリックプロパティと呼ばれ、オブジェクトを通じてこれらのプロパティに直接アクセスできます。

C++ や Java などのプログラミング言語では、オブジェクトのプライベートプロパティを定義するために private キーワードが使用されます。オブジェクトからプライベートプロパティに直接アクセスすることはできません。では、JavaScript でプライベートプロパティ (プライベート変数) を定義するにはどうすればよいでしょうか?実際、これは非常に簡単です。オブジェクトに対して set メソッドと get メソッドのペアを提供するだけです。たとえば、次のコード:

function Person(name){
  //此时就没有方法直接访问name这个属性，因为没有this.name
  //要访问name只能通过this.getName和this.setName来访问
  this.setName = function(value){
    name = value;
  }
  this.getName = function(){
    return name;
  }
}
 
var p = new Person("Leon");
alert(p.getName());

ログイン後にコピー

this.setName() メソッドを使用してオブジェクトの name 属性を設定し、this.getName メソッドを使用してオブジェクトの name 属性を取得します。このように、this.name 属性がないため、オブジェクトの name 属性に直接アクセスすることはできません。

上記の方法を使用してプライベート変数を作成する場合の問題は、各オブジェクトに多数の関数が格納され、大量のメモリを消費することです。この問題の解決策は、静的プライベート変数を使用することです。コードは次のとおりです。

var name = "";
var Person= function(value){
  name = value;
}
Person.prototype.setName = function(value){
  name = value;
}
Person.prototype.getName = function(){
  return name;
}
 
var p1 = new Person("Leon");
alert(p1.getName());
p1.setName("Ada");
alert(p1.getName());

ログイン後にコピー

setName() メソッドと getName() メソッドをオブジェクトのプロトタイプチェーンに入れることにより、メソッドの複数のコピーの問題を解決できます。ただし、上記のコードにはいくつかのセキュリティリスクがあり、これは前述したブロックレベルのスコープの問題です。同様に、このコードを匿名関数に入れることで、この問題を解決できます。

(function(){
  //name在函数结束之后就被回收，在外面是没有方法接收的
  var name = "";
  Person= function(value){
    name = value;
  }
  Person.prototype.setName = function(value){
    name = value;
  }
  Person.prototype.getName = function(){
    return name;
  }
})();
 
var p1 = new Person("Leon");
alert(p1.getName());
p1.setName("Ada");
alert(p1.getName());

ログイン後にコピー

Person クラスの定義を無名関数に入れて、すぐに無名関数を実行します。これにより、オブジェクトを使用してプロパティに直接アクセスできないことが保証されるだけでなく、各オブジェクトがメソッドの同じコピーを共有することも保証されます。

上記は JavaScript のクロージャブロックレベルのスコープとプライベート変数の内容です。さらに関連する内容については、PHP 中国語 Web サイト (m.sbmmt.com) に注目してください。