クロージャの理解に関する簡単な分析と例

この記事は、クロージャについて簡単に説明するもので、困っている友人に役立つことを願っています

スコープ チェーン

クロージャをより明確に理解するには、まずスコープ チェーンを理解する必要があります。 , そのため、クロージャを理解するのがはるかに簡単になります。

スコープ チェーンは、さまざまな変数格納スペースを指すリストで、通常はウィンドウの変数環境でグローバルに囲まれます。

各実行環境の [[scope]] 属性には、スコープ チェーンへの参照が保存されます。

var name = "tianci";

上記のコードの実行が完了すると、ブラウザの window.name 属性は「tianci」になります。この時点で、window[[scope]] が指すスコープ リストが指す変数空間の名前は「」になります。 tianci" が存在します

var name = "tianci";
function sy() {
    var name = "haha";
    console.log(name);
}
sy();//haha

このコードでは、sy() を実行すると、sy 実行環境の [[scope]] が指すスコープ リストが最初にウィンドウのスコープ リストを独自のリストにコピーし、次に sy 変数空間がコピーされます。スコープ リストの先頭 (つまり、list.[0] の位置) に挿入されます。 name が実行されると、name 変数はリストから 0->1 -> 2 ->3... と最上位の変数環境まで照会されます。

var name = "tianci";
function sy() {
    var name = "haha";
    console.log(name);
    console.log(this.name);
}
sy();

//haha
//tianci

2つの出力は異なります

log(name)のとき、関数syは最初にそれ自身の環境からnameを見つけます。そのため、haha

log(this.name)を出力するとき、syのthisは(ブラウザ内の)ウィンドウを指します。したがって、クエリは名前を検索するためにウィンドウ環境から開始されるため、出力は tianci

1 になります。スコープ チェーンは、関数が呼び出されるたびに、最初に次のようになります。呼び出し元のスコープ チェーンを独自のスコープ チェーンにコピーし、リンクされたリストの先頭に独自のスコープを挿入します。

クロージャ

クロージャの概念は、別のスコープ チェーンにアクセスすることを理解するのが難しいことではありません。関数スコープ内に変数を含む関数を作成するということは、次のような別の関数を漢府内に作成することです:

function cC(property) {
    return function (obj1,obj2) {        var value1 = obj1[property]
        var value2 = obj2[property]
        if (value1 < value2) {
            return -1;
        }else if(value1 > value2){
            return 1;
        }else if(value1 == value2){
            return 0;
        }
    }
}

ここでは、呼び出し関数の変数プロパティは、クロージャである匿名関数でアクセスされます

しかし、クロージャの問題、つまり、cC の実行後に匿名関数が終了しない場合、cC の環境アクティブ オブジェクトは、匿名関数の実行後にのみ破棄されます。そのため、クロージャは時々不必要なメモリリークを引き起こすことがあります

通常、匿名関数の this オブジェクトは (ブラウザ内の) ウィンドウを指します

返された匿名関数が取得されるとき、それは通常グローバル環境で直接呼び出されるため、これはこれにより、その時点でこれがウィンドウを指すようになります。

var name = "chentainci";
var obj ={
    name:"myboj",
    getName:function () {
        return function () {
            return this.name
        }
    }
}
console.log(obj.getName()())

Closure は変数の最終値を取得するだけです

function fun() {
    var result =new Array();
    for (var i  = 0;i  < 10; i++) {
        result[i] = function () {
            return i
        }
    }
    return result;
}

result は関数の戻り値 (i 10 の最終値) を格納します

関連推奨事項:

Closure クロージャとは

JS クロージャの深い理解

クロージャの一般的なアプリケーション

以上がクロージャの理解に関する簡単な分析と例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。