JavaScriptのクロージャについてメモ

Published: 2016年3月30日 by tomsato

概要

今日はJavaScriptのクロージャについて調べます

JavaScript勉強シリーズ

クロージャについて (簡単に)

クロージャとは一言で言うと「状態を持つ関数」
または関数を抜けた後にも生きるローカル変数とか
クロージャの例

function count() {
  var i = 0;
  return function() {
    return ++i;
  }
}

var x = count();
x(); // 1
x(); // 2
x(); // 3

前提として以下を知っておく必要がある

  • 関数内で別の関数を記述できる
  • 関数を返す関数を定義できる
  • ガベージコレクションが不要になった領域を自動で解放する
  • スコープチェーン

クロージャの仕組み

JavaScriptは不要になった領域を自動で解放するガベージコレクションという機能があり、参照元がなくなったオブジェクトなどは自動的に解放される

通常だと関数count(先の例の関数)の実行終了時に変数iなどはメモリ上から解放されるがグローバル変数xに関数count()が代入されているため変数xにnullをセットしない限り変数iは参照が残ることになる

この性質にスコープテェーンを利用してローカル変数の値を参照し続けるデータ構造がクロージャとなる

参考

Share

最近の投稿

NetlifyのSplit TestingとFunctionsについて使い方をまとめる Split TestingはGitHubのブランチをベースにしたA/Bテストを行うための機能のことで、FunctionsはNetlifyでAWS Lambdaを使うことができる

NetlifyとはHTMLなどの静的コンテンツのみで構成されたWebサイトを閲覧できる形で配信するWebサービス GitHubやBitbucket、GitLabなどと連携して使うことができて、リポジトリにプッシュすることで自動でCI/CDを行うことができる、無料枠が豊富で独自ドメインを設定可能

WordPressからJekyll(GitHub Pages)に移行した手順をまとめる。 お金的な事情や使いやすさなどの理由で無料のJekyll+GitHub Pagesに移行した。JekyllとはMarkdown等から静的ページを生成する静的サイトジェネレータ

Scala開発のためにScalaらしさをまとめる 言語設計者の設計思想を元にScalaらしさについてまとめる オブジェクト指向と関数型の融合について

StorybookとはUI開発環境を提供するツール React、React Native、Angular、Vueなどをサポートしている ユーザーは独立した開発環境でコンポーネントを個別に作成して挙動の確認をテストできたり、コンポーネントを一覧にしてカタログ化できるので他の人に紹介する時に使えたりする

カテゴリ一覧

タグ一覧