CoffeeScriptは死んだのか? CoffeeScriptのいいところ(Vue.jsを例に)

ES2015が登場してすっかりCoffeeScriptがオワコン化(オワコンという言葉自体がオワコンか?)した感があります。
嫌いな言語ランキングでも無事3位にランクインされました(https://fossbytes.com/most-loved-and-most-hated-programming-languages/ )。

CoffeeScriptはもう死んだ言語なのでしょうか?
いえいえ、ES2015登場後もCoffeeScriptを使うメリットはあります。
そこで、すっかり嫌われ者になってしまったCoffeeScriptのいいところを紹介したいと思います。
ちなみに、TypeScriptについては触れません(触ったことがないので)。

### CoffeeScriptは`;`が不要
21世紀にもなって`;`をつけないといけないのはかなり苦痛なのでこれは結構うれしいです。

### CoffeeScriptは比較が厳密

```js:js
""           ==   "0"           // false
0            ==   ""            // true
0            ==   "0"           // true
false        ==   "false"       // false
false        ==   "0"           // true
false        ==   undefined     // false
false        ==   null          // false
null         ==   undefined     // true
" \t\r\n"    ==   0             // true
```

```coffeescript:coffeescript
""           ==   "0"           # false
0            ==   ""            # false
0            ==   "0"           # false
false        ==   "false"       # false
false        ==   "0"           # false
false        ==   undefined     # false
false        ==   null          # false
null         ==   undefined     # false
" \t\r\n"    ==   0             # false
```

引用元: http://qiita.com/mugichan3/items/9462844b049900ffb22c

jsの比較はかなり醜悪です。それはES2015でも(おそらく未来永劫)変わりません。
代わりに`===`を使えばいいのですが、逆にうっかり`==`を使ってしまうとバグの元です。
CoffeeScriptでは多くの言語と同じように`==`を素直に使えばいいので簡素です。

### CoffeeScriptは`function`を`->`, `=>`でかける

```js:js
new Vue({
  created: function() {
    return this.hoge();
  }
});
```

```coffeescript:coffeescript
new Vue
  created: ->
    @hoge()
```

jsでは関数を多用しますが、関数を定義するのに`function`と書くのは長すぎます。
ES2015ではめでたく`function`を`=>`とかけるようになりました。
が、それは`this`が関数が定義されたスコープにおける`this`を引き継ぐ場合のみです。
引き継ぎたくない場合はあいかわらす`function`と書かなければなりません。

CoffeeScriptでは`this`を引き継がない場合は`->`、'this'を引き継ぐ場合は`=>`と書くことができます。
簡潔で素晴らしいです。

### CoffeeScriptは`return`が不要

```js:js
new Vue({
  el: '#hoge',
  data: {
    foo: 'FOO',
    bar: 'BAR'
  }
});

Vue.component('piyo', {
  data: function() {
    return {
      foo: 'FOO',
      bar: 'BAR'
    };
  }
});
```

```coffeescript:coffeescript
new Vue
  data: 
    foo: 'FOO'
    bar: 'BAR'

Vue.component 'piyo',
  data: ->
    foo: 'FOO'
    bar: 'BAR'
```

vue.jsにおいて、`data`は`Vue`のインスタンスではオブジェクトなのに対して、componentはオブジェクトを返す関数を定義しなければなりません。
jsでは`function`と書いた上、`return`も書かなければなりませんが、CoffeeScriptでは`->`をつけるだけです。
`Vue`のインスタンスとcomponentでインデントが統一できてきれいです。

### CoffeeScriptはオブジェクトに`,`が不要

```js:js
new Vue({
  methods: {
    sayFoo: function() {
      return console.log("FOO");
    },
    sayBar: function() {
      return console.log("BAR");
    }
  }
});
```

```coffeescript:coffeescript
new Vue
  methods:
    sayFoo: ->
      console.log "FOO"
    sayBar: ->
      console.log "BAR"
```

vue.jsではメソッドを上記のように定義します。
ここでメソッド`sayPiyo`を追加したい時、どうするでしょうか？
私はよく、`sayBar`をコピペして次のように書いてしまいます。

```js:js
new Vue({
  methods: {
    sayFoo: function() {
      return console.log("FOO");
    },
    sayBar: function() {
      return console.log("BAR");
    } // !!!
    sayPiyo: function() {
      return console.log("PIYO");
    }
  }
});
```
これは怒られます。なぜなら`sayBar`と`sayPiyo`の間に`,`がないからです。
キレそうになりますね。
CoffeeScriptではこのようなことはありません。

```coffeescript:coffeescript
new Vue
  methods:
    sayFoo: ->
      console.log "FOO"
    sayBar: ->
      console.log "BAR"
    sayPiyo: ->
      console.log "PIYO"
```

ストレスフリー!

---

以上、思いついたことを書いてみました。
最後までお読み頂きありがとうございます。
よきCoffeeScriptライフを！

### 追記

きたぜ! [CoffeeScript2](http://coffeescript.org/v2/#)
我がCoffeeScriptは永久に不滅だ!