javascriptの早期リターンとは何か【使い方までまとめます】

記述量が増えてくるとどうしてもコードが汚くなったりしがちで、わかりやすく書けないものかと思っていたときに早期リターンという書き方を意識したら割と良かったのでまとめておきます。

javascriptの早期リターンとは

returnを小刻みにおいてあげることで可読性が上がるとともに関数を呼び出しやすくなります。

returnを早め早めにおいてあげることですっきりしたコードを書く。 これが早期リターンです。

Javascriptのreturn

return文を使うと関数内で処理をした結果を「戻り値」として返すことができます。

 関数は「return」を使わずに処理を行ったらそのまま終了となります。

例）

 function test(){

const element=documentgetElementById("container");

alert element;

}

この場合elementを表示して終了

ネストが深いと可読性が下がる

JavaScriptに限らず、if文が何重にも重なる関数は可読性が低いです。

つまり「読みにくいコード」になります。

例えば次のような感じ。

function test (name)
{
    if( name ){
        if (name = "takeda") {
            return name;
        } else  {
            return "たかだ以外";
        }
    } else
    {
        alert("名前がありません");
        return;
    }
}

そこで早期リターン！！

上記コードを早期リターンを使って書いてみます。

function test (name)
{
    if ( !name )
    {
        alert( "名前がありません" );
       return
    }
    if ( name = "takeda" )
    {
        return name;
    }
    return "たかだ以外"
}

処理ごとに「早めにリターン」することで、わかりやすいコードになりましたね。

今回はあくまで例なので、しょうもない関数ですが、もう少し複雑になってくると、さらに見やすくなるかと思います。

積極的に使っていきましょう

ということで、早期リターンの解説でした。

使っていない方がいたらコードレビュー等で指摘してあげるといいですよ。