■目次

解説

即時関数が保守性を高める理由

• カプセル化できるから

  • 他の関数と影響し合わなくなる（スコープの範囲を絞ることができる）

    → カプセル内だけ見れば済むので保守が楽になる

  • カプセル内のメソッドは簡単に呼び出せる

【どうやってカプセル化するのか】

1. 機能ごとにファイルを分割する
2. ファイル内のコードを即時関数でラップする
3. 即時関数内で以下を記述する
   1. 初期化
   2. メソッド

即時関数を使うメリット

1. スコープを限定できる
2. 疑似的なオブジェクト指向開発ができる
   1. 再利用できる
   2. 必要なときに呼び出せる

JavaScriptのスコープとは

• 同じ名前をつけてはいけない範囲・空間

  同じスコープにあるものは、基本的に同じ名前を持てない

  ❌ 家族内

  ⭕️ 町内

• JavaScriptのスコープは2種類ある

  • グローバルスコープ：

    jsファイルにベタ書きした変数（定数）

    ()や{}で囲っていない場合、ファイルを分割していたとしてもグローバルスコープとして扱われるため、既にある変数を再宣言するとエラーになる

  • 関数スコープ：

    関数内に記述した変数（定数）

    影響範囲は関数内のみ

☆ 即時関数の使い方

公式

• 関数が宣言された時点ですぐに初期化処理の実行やメソッドの定義がされる

  • (() => {})();と、()の後にすぐ()をつけることで、即時にその関数が実行されるから

  <aside> 🌿 即時間数内のメソッドは、即時に定義されるだけで実行はされないよ

  </aside>

• 初期化処理は必要なければ記述しなくてOK

const hogeModule = (() => {
	// 初期化処理（あれば）

	return {
		piyoFunc: () => {
			// メソッド
		},
		・
		・
		・
	}
})();