折り畳んでもコメントが隠れないif文の書き方

はじめに

普段はほぼ拡張機能を導入していないVSCodeやSublime Textでコーディングをしているのですが、その中で最近いいなと思っているif文の書き方を紹介したいと思います。

一般的な書き方

const [ isFoo, isBar ] = [ false, true ] ;
const doAnything = () => {};

if (isFoo) {
    // fooの場合
    doAnything();
} else if (isBar){
    // barの場合
    doAnything();
} else {
    // どちらでもない場合 
    doAnything();
}

2024/09/19 行末に記述する例から、ブロックの内側に記述する例へ変更しまいた。

多くの場合は上記のように同じ行で} else {と記述し、コメントは行末かブロックの内側に書くことが多いと思います。ですが拡張機能とかを入れていない状態でコードを折りたたむとコメントが巻き込まれてしまい少し読みづらいなと感じていました。

折りたたんだ状態

const [ isFoo, isBar ] = [ false, true ] ;
const doAnything = () => {};

if (isFoo) { ...
} else if (isBar){ ...
} else { ...
}

該当のコード

const [ isFoo, isBar ] = [ false, true ] ;
const doAnything = () => {};

// fooの場合
if (isFoo) {   
    doAnything();
}

// barの場合
else if (isBar) {    
    doAnything();
}

// どちらでもない場合 
else {               
    doAnything();
}

上記のように}の後に改行してからelse句を始めてその上にコメントを記述することで、エディタでコードを折り畳んでもコメントが隠れないようになります。

折りたたんだ状態

const [ isFoo, isBar ] = [ false, true ] ;
const doAnything = () => {};

// fooの場合
if (isFoo) { ...
}

// barの場合
else if (isBar) { ...
}

// どちらでもない場合 
else { ...
}

注意点

補助が少ないエディタで今回のようなスタイルで記述をしている場合、コメントを書くスペースに動作する記述をしてしまってもエラー表示がなされない場合もあります。
鋼の意志を持って注意するか、/* */で間のスペースを丸ごとコメントアウトして動作する記述をできないように回避するかっていう対応になるかなと思います。

まとめ

あまり一般的ではなく実装ミスが混入する恐れがある場合もあるため、チームでコーディング規約を決めているなどの固い環境向けというよりは、個人開発や趣味など自分で気をつけて読みやすい書き方ができればいいゆるい環境向けというような感じです。

読みやすい条件式を書く、理解しやすい変数or関数を条件式に使用するなどで、コメントを使用しなくて読みやすくする方法などと適宜使い分けをすると効果的かなと思います。