Cacher is the code snippet organizer for pro developers

/* ======================================
 * Action
 * ====================================== */

{
  type: 'ADD_ITEM',
  item: {
    name: '商品1', price: 500
  }
}


/* ======================================
 * Dispatcher
 * ====================================== */

// Storeからのコールバックの登録
dispatcher.register((action) => {
  if (action.type === 'ADD_ITEM') {
    // Storeのデータを更新
    // action.item は { name: '商品1', price: 500 }
  }
});
// Actionを引数に、登録されたコールバックを呼び出す
// 前述のコールバックが実行される
dispatcher.dispatch({
  type: 'ADD_ITEM',
  item: {
    name: '商品1', price: 500
  }
});


/* ======================================
 * Store
 * ====================================== */
 
const data = {
  items: []
};

CartStore.dispatchToken = dispatcher.register((action) => {
  if (action.type === 'ADD_ITEM') {
    data.items.push(action.item);
  }
});


/* ======================================
 * View
 * ====================================== */

class AppComponent extends React.Component {
  componentDidMount() {
    // Storeの更新を監視
    cartStrore.on('CHANGE', this._update.bind(this));
  }

  _update() {
   // StoreのデータでViewをすべて更新
   this.setState({ cartItems: cartStore.getItems() });
  }
}