> For the complete documentation index, see [llms.txt](https://typescript-jp.gitbook.io/deep-dive/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://typescript-jp.gitbook.io/deep-dive/recap/closure.md).

# クロージャ

JavaScriptで最も素晴らしいものは、クロージャでした。 JavaScript関数は、外部スコープで定義された変数にアクセスできます。クロージャを理解するには、例を見るのが一番です。

```typescript
function outerFunction(arg) {
    var variableInOuterFunction = arg;

    function bar() {
        console.log(variableInOuterFunction); // 外側のスコープにある変数にアクセスします
    }

    // argにアクセスできることを示すために、ローカル関数を呼び出します。
    bar();
}

outerFunction("hello closure"); // "hello closure"とログに出力されます
```

内側の関数は外側のスコープの変数(variableInOuterFunction)にアクセスできることがわかります。外側の関数の変数は、内側の関数に閉包されています(または束縛されています)。したがって、クロージャ(closure)という用語のコンセプト自体は簡単で直感的です。

クロージャの素晴らしい点：内側の関数は、外側の関数が`return`された後でも変数にアクセスできます。これは変数が内側の関数に束縛されており、外側の関数に依存していないからです。もう一度例を見てみましょう：

```typescript
function outerFunction(arg) {
    var variableInOuterFunction = arg;
    return function() {
        console.log(variableInOuterFunction);
    }
}

var innerFunction = outerFunction("hello closure!");

// outerFunctionが返しているものに注意してください
innerFunction(); // "hello closure!" と出力されます
```

## なぜクロージャが素晴らしいか

オブジェクトを簡単に作成することができます。リヴィーリングモジュール(revealing module pattern)というコーディングパターンがあります：

```typescript
function createCounter() {
    let val = 0;
    return {
        increment() { val++ },
        getVal() { return val }
    }
}

let counter = createCounter();
counter.increment();
console.log(counter.getVal()); // 1
counter.increment();
console.log(counter.getVal()); // 2
```

クロージャを使いこなせば、Node.jsのようなものを作ることもできます(今はピンとこなくても、心配しないでください。最終的には分かります🌹):

```typescript
// 概念を説明するための疑似コード
server.on(function handler(req, res) {
    loadData(req.id).then(function(data) {
        // `res`が閉じ込められており、ここで利用可能です
        res.send(data);
    })
});
```


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://typescript-jp.gitbook.io/deep-dive/recap/closure.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.