JavaScriptの基礎知識まとめ(10) クロージャと即時実行関数

今回はJavaScriptの基礎知識まとめ(10) クロージャと即時実行関数 実践事例を見ていきましょう。

//例子function a() {    function b(){        var bbb = 234;        console.log(aaa)
    }    var aaa = 123;    return b;
}var glob = 100;var demo = a();
demo();

まず、この関数が return b を実行した後、関数 a は実行を終了し、a の AO は破棄されますが、関数 b は破棄される前に保存されているため、b の実行コンテキストは破棄されませんでした。

したがって、b の AO と Go は保存されます

このようにして、クロージャが形成されます。次のようにも言えます:

内部関数は外部に保存され、クロージャを形成する必要があります

function a (){    var num  = 100;    function b(){
        num ++;        console.log(num);
    }    return b;
}var demo = a();
demo();//打印101demo();//打印102

。クロージャの概念: 内部の場合 関数が外部に保存されると、クロージャが生成されます。閉じると、元のスコープ チェーンが解放されなくなり、メモリ リーク (メモリ占有) が発生します

メモリ リーク: たとえば...コップ...水を入れるほど、メモリが少なくなります (同様に、占有するメモリが増えるほど、メモリの量は減ります)

クロージャの役割

パブリック変数を実装

関数アキュムレータ

はキャッシュ(ストレージ構造)として使用できます

eater

はカプセル化を実現できます, 属性のプライベート化

person()

グローバル変数の汚染を防ぐためのモジュラー開発

1. 上記のアキュムレータの例が書かれています

2. キャッシュ(記憶構造)ができる

function test(){    var num = 100;    function a(){
        num ++;        console.log(num);
    };    function b(){
        num --;        console.log(num);
    };    return [a,b]
}var myArr = test();
myArr[0]();//打印101myArr[1]();//打印100
function eater(){    var food = "";    var obj ={        eat : function(){            console.log("i am eating" + food)
        },        push : function (myFood){
            food = myFood;
        }
    }    return obj;
}var eater1 = eater();
eater1.push('banana');
eater1.eat();//打印出 i am eating banana

上記例 I eater1.push('banana') の後に、eater の foot = "" が与えられ、 food = "banana" になります。 eater1.eat() を実行すると、 food = "banana" が得られました。これらはすべて同じクロージャで動作するため、このフットは暗黙的なストレージ構造に相当します。これはキャッシュ アプリケーションです。

自分でピットを購入してください。プロパティはプライベート化されています。

オブジェクトを書き終えた後に説明します。モジュール開発にも同じことが当てはまります

関数をすぐに実行してください

このタイプの関数は一度に宣言されていません処刑後に釈放される。初期化作業に適しています。

function a(){
    
}function b(){
    
}

私は 2 つの関数を定義しています。これら 2 つの関数は JavaScript が実行されるまで待機しない限り、解放されることはなく、常に実行を待機することになります。

関数: 初期化関数

(function (aaa,bbb,ccc){    var a = 234;    var b = 123;    var c = a+b;    console.log(c)    return c}(1,2,3))
执行完立即被销毁
// 怎么去接收他var num = (function (aaa,bbb,ccc){    var a = 234;    var b = 123;    var c = a+b;    console.log(c)    return c}(1,2,3))
立即执行函数有两种写法
//第一种(function(){}());//w3c 建议第一种//第二种(function(){})();
扩展
只有表达式才可以被执行符号执行
var test = function (){}()//也可以被执行+ function test(){}()//也可以被执行 以此类推- !号也可以function test(){    console.log(a+b+c+d)}(1,2,3,4)//不执行也不报错

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、PHP 中国語 Web サイトの他の関連記事に注目してください。

関連書籍:

JavaScriptの基礎知識まとめ (9) スコープとスコープチェーンの洗練

JavaScriptの基礎知識まとめ (8) プリコンパイルの実行処理

JavaScriptの基礎知識まとめ (7) 再帰

以上がJavaScriptの基礎知識まとめ(10) クロージャと即時実行関数の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。