今までRubyとPHPをやってきて、JSは苦手だったのですが、なんとなくわかってきました。

JSをどんな時に使うか

デザインに動きをつけたい時

これは定番の使い方です。
フロントエンジニアのほとんどがこの使い方じゃないでしょうか。
jQueryなのかもしれませんが。

画面遷移したくない時

サーバサイドよりの使い方です。
ボタンを押すたびに画面が一度切り替わってトップに戻ると使いづらいです。
ボタンを押しても画面がそのままで値だけ変わるような作りにしたいときに使います。

個別データを渡したい時

確認モーダルから削除を行う方法
https://qiita.com/KendyNakamura/items/36b2fd617d49d491c626

一覧画面からモーダル確認をつけて削除をしたい時などに使用します。

クラスを付け替え

クリックしたら違うアイコンを出したい時に使います。
addClassとremoveClassを組み合わせて、
<input class="text">
<input class="hidden">
みたいにしておいて、クラスを入れ替えることで表示の切り替えができます。

もっといろんなことができると思いますが、今の所使えそうなのはこんなところです。