JavaScriptのクロージャとは?仕組みと使い方をわかりやすく解説
JavaScriptを深く理解するうえで避けて通れないのが「クロージャ(Closure)」です。
難しそうに聞こえるかもしれませんが、正しく理解すればとても便利な仕組みです。
この記事では、クロージャの基本的な仕組みと、どのように使うのかを初心者にもわかりやすく解説します。
クロージャとは?
クロージャとは、**関数が定義されたときのスコープ(環境)を記憶している関数**のことです。
関数の外で宣言された変数を、関数の中から使うことができる仕組みと考えるとイメージしやすいです。
基本的な例
function outer() {
let count = 0;
function inner() {
count++;
console.log(count);
}
return inner;
}
const counter = outer();
counter(); // 1
counter(); // 2
この例では、outer
関数の中で定義された inner
関数が、count
という変数を覚えています。
outer
関数の実行が終わっても、count
の値は保持され続け、inner
を呼び出すたびにカウントが増えていきます。
なぜクロージャが必要なのか?
クロージャには以下のような利点があります。
- 変数の「隠蔽(カプセル化)」ができる
- 状態を保持できる(メモリに残す)
- 関数ごとに独立したスコープを持たせられる
実用的な使用例:プライベート変数
function createCounter() {
let count = 0;
return {
increment: function() {
count++;
console.log(count);
},
reset: function() {
count = 0;
console.log("リセットされました");
}
};
}
const counter = createCounter();
counter.increment(); // 1
counter.increment(); // 2
counter.reset(); // リセットされました
count
は外部から直接アクセスできませんが、メソッドを通じて操作することができます。
これにより、値の不正な変更を防ぐことができます。
注意点:メモリリークの可能性
クロージャを使うと変数がメモリに保持され続けるため、必要がなくなった関数への参照を残しておくとメモリが解放されません。
長期的に使うアプリケーションでは、不要になったクロージャを適切に破棄することが重要です。
まとめ
- クロージャは関数が外部の変数を記憶し続ける仕組み
- 関数の実行後も変数の状態を保持できる
- 状態管理やプライベート変数の実装に便利
- 使いすぎるとメモリリークの原因にもなるため注意が必要
JavaScriptのクロージャは、柔軟で強力な仕組みです。
実際に使ってみて、動作を確認しながら理解を深めていくのがおすすめです。