markdown モジュールパターン＃1

Posted 2021-05-06

// モジュール/moduleName/
const moduleName = (() => {
  
  // モジュールスコープ変数
  // 構成値(定数)
  const configMap = {
    MODULE_PROPERTY: 'value'
  }
  // 状態値（変数）
  const stateMap = {
    moduleProperty: 'value'
  }
  // その他のすべてのモジュールスコープ変数を宣言する
  let domMethod, onEventMethod, initModule

  // DOMメソッド
  domMethod = () => {
    
  }

  // イベントハンドラ
  onEventMethod = (event) => {
    
  }

  // パブリックメソッド
  // 初期状態を設定し、機能を提供する
  initModule = () => {
    // HTMLをレンダリングする
    // イベントをイベントハンドラにバインドする
  }
})()

// DOMの準備ができたら開始する
document.addEventListener('DOMContentLoaded', () => {
  moduleName.initModule()
})

JS-モジュールパターン #1
---------------


A [Pen](https://codepen.io/taquaki/pen/wqgypb) by [Takaaki Sato](https://codepen.io/taquaki) on [CodePen](https://codepen.io).

[License](https://codepen.io/taquaki/pen/wqgypb/license).