.click()と.on("click")の違い

今回のテーマ

現在jQueryを学んでますがクリックイベントの取得について以下の２つの記述があり困惑したので、何がどう違うのか個人的に調査してまとめました。

.click()

$('#button').click(function() {
  alert("ボタンが押されました");
});

.click()はjQuery公式ドキュメントではこう説明されています。

Bind an event handler to the "click" JavaScript event, or trigger that event on an element.

クリックすることでイベントを発火することが出来るということでした。
また、こうとも書いてあります。

This method is a shortcut for .on( "click", handler )

.click()は.on("click")のショートカットだったんですね！

.on("click")

$('#button').on('click', function() {
  alert("ボタンが押されました");
});

.on("click")はjQuery公式ドキュメントではこう説明されています。

Attach an event handler function for one or more events to the selected elements.

.clickとの違いは、 one or more events のところでしょうか。訳すと、１つかそれ以上のエレメントにイベントを付属する、です。つまり複数のイベントを定義できるということになります。
例えば、.click()ではイベント発生後に新たなボタンが現れたとしたら、イベントを付与できないが、.on("click")ではそれが可能ということになります。

まとめ

.click()は.on("click")のショートカットでした。
しかしその後に複数のイベント起こしたいのであれば.on("click")でなければ出来ないので、複雑な機能を組むのであればこちらを使うべきでしょう。