コード日進月歩

しんくうの技術的な小話、メモ、つれづれ、など

jquery で 要素の確認に length を使うのであればちゃんと比較演算子を使って欲しいという気持ち

雑記

コードレビューしてるとときたま見かけて、すごくなんとも言えない気持ちになったのでそれに対する叫び的な雑記

よくあるコード

<div id="xxx">
    <div class="sample">
        サンプル
    </div>
</div>

$(function(){
    if($('#xxx').children('.sample').length) {
      console.log("class sample has");
    }
});

みたいな形で もってないと length が 0になるので、 ifの結果がfalseになるというもの。

よくあるコードのつらさ

  • jqueryの知見がない場合、要素の確認ではなく要素数の確認をしていると誤認する
  • lengthって数値を返すものでbooleanを返すものじゃないのに、jsが0をfalseと受け取る性質を使っているので非常にグレーゾーン
  • ifの判定はなるべくbooleanとなるような値を利用すべき

よくあるコードの改善案

  • ちゃんと比較演算子で表現する
  • わかりにくいのでコメントに書く
$(function(){
    // lengthが0のときは要素として存在しないとみなす
    if($('#xxx').children('.sample').length > 0) {
      console.log("class sample has");
    }
});

参考サイト