Panda Noir

JavaScript の限界を究めるブログでした。最近はいろんな分野を幅広めに書いてます。

アロー関数とかclassとかfunctionとか

いろいろ出てきたのでfunction(){}使う機会減ったよねという記事です

4種類のfunction呼び出し

functionは呼び出し方(thisが何をさすか)で4種類に分類されます。

  1. 関数として
  2. コンストラクタとして
  3. メソッドとして
  4. apply、callを使い、thisを変更して

常識ですね。以前はこんなにも複雑怪奇だったのです!

アロー関数の呼び出し

アロー関数は上の4つのうち、「普通の関数として」しか使用できません。

コンストラクタとして呼ぼうとすればエラーが出ます。メソッドとして使おうとしても、thisがオブジェクトを指してくれません。applyやcallを使ってもthisは変わりません(thisが変わらないだけで呼び出し自体はできます)。

ということでアロー関数は「関数として」しか使えません。

クラス

クラスが正式に導入されたので、「コンストラクタとして」のfunctionは消え失せます。これで、コンストラクタがnewなしで呼ばれてしまうという事故もなくなります。

また、メソッドも正式に導入されたので、(基本的には)functionでメソッドを定義する必要はありません。

ただし、あとからメソッドを追加する場合は、thisがインスタンスになって欲しいので、functionでないといけません。

class MyClass {};
MyClass.prototype.doSomething() = function() {};

というわけで現在のfunction

アロー関数とクラス、functionを用途別に使い分けて、functionへの負担を減らしましょう。

というかfunctionは今や、後からクラスにメソッド追加するときくらいしか使いません。ほぼ絶滅したと言ってもいいでしょう(過言)。

あとはapplyで呼ばれることが前提となるもの(jQueryイベントハンドラはapplyでイベントが起きた要素が渡される)はfunctionでないとですが…まずそうそうないですね。めでたしめでたし