＜jQuery＞smoothscroll実装について

Question

質問

smoothscrollの実装方法でネット検索した際、
以下のコードが記載されていることがほとんどですが、
コードの品質的に改善点（もっと短くかける・より汎用的に・より厳密にする）などがあれば
教えていただきたいです。

$(function() {
  $('a[href^="#"]').click(function() {
    var speed = 400;
    　　 href= $(this).attr("href"),
    　　 target = $(href == "#" || href == "" ? 'html' : href),
    　　 position = target.offset().top,
    $('body,html').animate({scrollTop:position}, speed, 'swing');
    return false;
  });
});

例えば

①var target = $(href == "#" || href == "" ? 'html' : href);
は ===　で厳密等価演算子にした方が良い。
②href、targetなどのプロパティなのか変数名なのか、分かりづらいものは先頭に_をつける。
③ $('a[href^="#"]').click(function()の、.clickは汎用性が低いので、.on('click'
にするなど
※上記、1・2・3の判断が正しいかもご回答いただけると幸いです。

よろしくお願い致します。

Answer 1

①var target = $(href == "#" || href == "" ? 'html' : href);

は ===　で厳密等価演算子にした方が良い。

文字列「#」が別の文字列として解釈されることはほぼないので、どちらでも構いません
ただ、文字列の比較はつねに「===」を意識づけておいたほうがよいのは確かです。

②href、targetなどのプロパティなのか変数名なのか、分かりづらいものは先頭に_をつける。

グループで管理しているならそのグループの方針にあわせてください
先頭に_のついた変数事自体めずらしくはないですが、
暗に特別の意味合いをつけると別の現場では通用しませんので
適切な命名方法を検討ください

③ $('a[href^="#"]').click(function()の、.clickは汎用性が低いので、.on('click'

にするなど

onは汎用性が高く、便利なので積極的に利用した方がいいと思います。

Comments

[decteckaaaaaaaa]

ご回答いただきありがとうございます！

②についてですが、業界のスタンダードとしてはどうかなと思いの質問でした..！
適切な命名方法は、targetなどは避けて「hogeTarget」等のユニークな命名にした方が良い
ということでしょうか？？