LoginSignup
10
11

クロージャ(Closure)

Last updated at Posted at 2017-10-29

業務でJavascriptのクロージャを勉強する機会があったので、
まとめておく。

①クロージャの概要
②具体的なプログラム
③クロージャのポイント
④クロージャの特徴とメリット
⑤クロージャの深い理解
⑥クロージャとメモリの関係

①クロージャの概要

クロージャは、独立した (自由な) 変数を参照する関数です。言い換えるとクロージャ内で定義された関数は、自身が作成された環境を '覚えています'。

他には、

クロージャ(クロージャー、英語: closure)、関数閉包はプログラミング言語における関数オブジェクトの一種。いくつかの言語ではラムダ式や無名関数で実現している。引数以外の変数を実行時の環境ではなく、自身が定義された環境(静的スコープ)において解決することを特徴とする。

といった定義があります。
どうやら、*closure(閉鎖、締め切り、閉店)*といった意味も踏まえると、
閉ざされた空間で環境を保持していることが伺えます。

②具体的なプログラム

closure.js
function closure(){ 
  var cnt = 0; 
  return function(){ 
    return ++cnt;
  }
}
var f = closure(); //関数closureを変数fに代入
console.log(f()); //1
console.log(f()); //2
console.log(f()); //3
console.log(f()); //4

closure.jsは、
console.log(f());で、関数f()を実行する度に、出力される数字が
1ずつ上がっていっています。
このように、関数f()が変数(数値)の値を保持している機能をクロージャと呼びます。

③クロージャのポイント

クロージャであるポイントは、以下の4つです。

A.関数の中に関数を作ること(関数closureの中に関数functionを作成)
B.外側の関数内に変数を定義する(関数closure内に変数cntを定義)
C.関数の中で入れ子になった関数内関数を返り値として返す(returnで関数functionを返している)
D.内側の関数からローカル変数を参照(関数function内でcntを参照)

④クロージャの特徴とメリット

クロージャの特徴として、値を保持しつづけることができる処理をまとめて記述できるのでプログラムの構造がわかりやすいといったメリットがあります。

グローバル変数だと、名前の衝突といった問題がありますが、クロージャだとそれを解決してくれます。

⑤クロージャの深い理解

なんで、このような機能をもてるようになるのか?
これは、Javascriptの変数スコープの話や、関数ルールがそうさせています。
このサイトに詳しく書かれています。
http://analogic.jp/closure/

⑥クロージャとメモリの関係

クロージャを多用しすぎると、メモリが足りなくなることが起こりうるので、
メモリの使用を抑えたい場合は、極力使用しないほうがいいそうです。
これは、分かれば追記しようかなと思います。

以下のサイト・本を参考にしました。

http://analogic.jp/closure/
https://qiita.com/takeharu/items/4975031faf6f7baf077a
https://developer.mozilla.org/ja/docs/Web/JavaScript/Closures
脱初心者のためのプログラミング教本

10
11
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
10
11