Javascript のクロージャについて

Javascript のクロージャについて

スコープの種類と概要

Javascript におけるスコープとは、どの変数にアクセスできるかを考える時に必要になってくる。
スコープには、グローバルスコープ・ローカルスコープ・関数スコープ・ブロックスコープが存在する。

グローバルスコープは、同一ファイル内であれば、どこでも参照できる。

//var で宣言することでグローバル変数となる
var hensu = 100;

ローカルスコープは、グローバルスコープ以外の全てのスコープで、関数スコープとブロックスコープに分かれる。
関数スコープは、関数の中で定義される変数のスコープで、その関数内部でしかアクセスできない。

//関数の引数は関数スコープとなる
function test(hensu) {
  console.log(hensu);
}

ブロックスコープは、{}で閉じられたブロックによって定義されてその中で宣言された変数のスコープであり、その中でしかアクセスできない。

function test() {
  //{}の中にあるので、ブロックスコープとなる
  let hensu;
  console.log(hensu);
}

クロージャの利点

クロージャとは、ローカルスコープの変数を保持する他の関数が内部に存在している関数を指します。
以下が例になります。xというローカル変数は、外部から直接操作することはできず、直接取得することもできない。これを、javaなどのオブジェクト指向言語で言うと「カプセル化」と呼ぶ。

function test() {
 //カプセル化されている
 let x = 0;
 return {
  get: () => { 
   return x;
  },

  set: (newX) => {
   x = newX;
  },
  //カプセル化されていない
  y: 2
 }
} 

カプセル化を行うことによって、誤って値を上書きすることを防ぐことができる。

let func = test();

//カプセル化できている
console.log(func.x); //undefined
console.log(func.get()); //0
func.set(10); 
console.log(func.get()); //10

console.log(func.y); //2
//カプセル化できていない
func.y = 12
console.log(func.y); //12