Reduxのaction周りと,ES6の記法がわかりません

Question

このページとこのページを参考にしてReduxを勉強をしています。

このページの著者のgithubはここにあります。

このサイトの中にこんなコードが有りました。

// src/actions/app.jsx

//import AppActions from '../actions/app'で呼び出し
export default {
  increment: () => {
    return { type: 'INCREMENT' }
  }
}

//import {increment} from '../actions/app' で呼び出し
export function increment(){
    return {
        type: 'INCREMENT'
    }
}

コレに関して3つほど質問があります。

一つ目はこのコードはES6の記法に従っているのでしょうか。それともES5のものなのでしょうか。
同じページにある

function mapDispatchToProps(dispatch) {
  return {
    handleClick: () => { dispatch(increment()) }
  }
}

がES5だと思ったので、わからないながらも以下のように書き換えてみました。

const mapDispatchToProps = (dispatch) => {
  return{
    handleClick(){
      dispatch(AppActions.increment())
    }
  }
}

基本的にHoge: ()=>のような記述はES5だと思っていますが、この認識はあやまってますでしょうか。上のコードがES6なのかどうか、もし違うならES6での書き方を、もしES6ならこの記法の名称（またはこの記法について調べる時のキーワード）があればそれを教えてほしいです。

二つ目にこのコードの後半はactionを定義しているのだと思いますが、前半のexport default{}の部分は何をしているのでしょうか。いろいろなところでReduxについて調べているのですが、Action周りについては書き方のレパートリーが沢山あるように見えるのと、ES5とES6で書いているものあるので理解が芳しくありません。

レパートリーの具体例としては
（アロー関数、returnなし)

export const onNumClick = (number) => ({
  type: actionTypes.INPUT_NUMBER,
  number,
});

変数の中に関数

const Actions = {
  addTodo(value) {
    return {
      type: 'ADDTASK',
      value,
    }
  },
  fixTodo(value) {
    return {
      type: 'FIXTASK',
      value,
    }
  },
  updTodo(value) {
    return {
      type: 'UPDTASK',
      value,
    }
  },
  delTodo(value) {
    return {
      type: 'DELTASK',
      value,
    }
  },
}

3つ目は最初のコードのincrement()をcontainerファイル内で
import AppActions from '../actions/app'でimportして、AppActions.increment()で利用している点です。
最初に載せているコードがsrc/actions/app.jsxの全文なのですが、このなかにAppActionという単語は一つもないのになぜimportできているのでしょうか。

Reduxについて全然体系的に学習できていないのは、ES6,React,Reduxそれぞれの知識が曖昧なのは重々承知しています。
行き詰まってしまったので、どなたかお力添えして頂けると助かります。
よろしくお願いします。

Answer 1

1．
アロー関数というES6で導入された記法です。

2&3.
import foo from bar

と書くとbarファイル内でexport default{}されたオブジェクトがfooという名前で呼び出せます。

Answer 2

調べて続けていると、丁度同じようなものを解説しているサイトが有りました。
http://yukidarake.hateblo.jp/entry/2015/08/11/210227

ここによるとこのコードはアンチパターンのようです。
ですので以下のように書き換えます。

import * as actionTypes from '../actionTypes'

// export default{
//   showDialog: () => {
//     return {type: actionTypes.SHOW_DIALOG}
//   },
//   closeDialog: () => {
//     return {type: actionTypes.CLOSE_DIALOG}
//   },
// }

export const showDialog = () => {
  return{
    type: actionTypes.SHOW_DIALOG,
  }
}

export const closeDialog = () => {
  return{
    type: actionTypes.CLOSE_DIALOG,
  }
}

としてimportするときは
`import * as AppActions from './actions/app.jsx'
とでもすると理想通りの挙動を確認できました。