🌟

クロージャを理解していなかった（JavaScript）

2024/06/26に公開

JavaScript

PHP

tech

前置き

JavaScriptを学ぶ上で欠かせないクロージャ
名前は知ってたけどなんのことかさっぱりわかっていなかったのでここに知識まとめる
以下が必要な知識らしい

実行コンテキスト
レキシカルスコープ
クロージャ

実行コンテキスト

コードが実行される状況のこと
グローバルコンテキストが関数コンテキストを内包している（関数内の関数のコンテキストも同様）

レキシカルスコープ

外部変数

関数コンテキストから見ると、その外にある変数がレキシカルスコープにあたる

const global_hoge; //　グローバルコンテキストの変数, 関数コンテキストから見たレキスコ

function example() {
    let inner_hoge; // 関数コンテキストの変数
}

クロージャ

レキシカルスコープを参照している状態

let global_count = 0;

function closure_example() {
    return global_count++; // 関数の外にある変数を参照している
}

PHPだとクロージャに明示的に変数を渡す必要がある

$global_count = 0;
$closure_example = function() use (&$global_count) {
    return $++global_count;
};

$closure_example(); //1

なぜクロージャ

関数終了後も変数の値を保持できる（グローバル変数を使用する必要がなくなる）

グローバル変数使った場合

let count = 0;
let counter = function(){
    return count++;
}

counter(); // 0
counter(); // 1

クロージャ使った場合

let counter = (function(){
    let count = 0;
    // クロージャを作成して返す
    return function() {
        return count++;
    };
})();

counter(); // 0
counter(); // 1

感想

クロージャって無名関数っていうからただ単に名前のない関数を指すのだと思ってた😇w
まだ理解乏しいから実践積んで理解深めるお
終わり。

クロージャを理解していなかった（JavaScript）

前置き

実行コンテキスト

レキシカルスコープ

クロージャ

なぜクロージャ

感想

参考

Discussion