[javascript入門] If文やSwitch文などの条件式に対してコード数を減らして表現する方法


はじめに

If分やSwitch分は、ある条件式を評価し、その結果を返す一般的な方法です。

ただ、If文やSwitch文はコード数が多くなりがちで全体的なコード数が増大してしまうという懸念もあります。

本投稿ではそういったことを解消するためにif文やswitch文をよりコード数が少ない形で表現する方法となります。

コード数を削減する方法

下記のようなif文やswitch文があります。

// switch文を使った場合の条件式
function returnDayForSwitch(value) {
    switch (value) {
        case 1:
            return "Monday";
        case 2:
            return "Tuesday";
        case 3:
            return "Wednesday";
        case 4:
            return "Thursday";
        case 5:
            return "Friday";
        case 6:
            return "Saturday";
        case 7:
            return "Sunday";
        default:
            return "the value is invalid.";
    }
}

// if文を使った場合の条件式
function returnDayForIf(value) {
    if (value == 1) {
        return "Monday";
    } else if (value == 2) {
        return "Tuesday";
    } else if (value == 3) {
        return "Wednesday";
    } else if (value == 4) {
        return "Thursday";
    } else if (value == 5) {
        return "Friday";
    } else if (value == 6) {
        return "Saturday";
    } else if (value == 7) {
        return "Sunday";
    } else {
        return "the value is invalid.";
    }
}

console.log(returnDaySwitch(4)) 
// Thursday
console.log(returnDayIfElse(4))
// Thursday

上記を見ていただくとわかりますが、switch文が20行、if文が19行となっています。

if文やswitch分を使った方が理解しやすいケースも多いですが、汎用的に利用できるような形で表現したいと思います。

function returnDayForTechniques (value) {
    const returnObj = {1: "Monday",2: "Tuesday",3: "Wednesday",4: "Thursday",5: "Friday",6: "Saturday",7: "Sunday",};

    if(!returnObj[value]) {
        return "the value is invalid.";
    }
    return returnObj[value];
}

console.log(returnDayForTechniques(4))
// Thursday

上記のように返り値をKeyValueペアのオブジェクトとして定義しておき、Keyに対する値が存在しない場合はエラーを返し、そうでない場合はそのオブジェクトを返すようにしています。

こうする20行程度あったコードが8行で済みます。約2分の1以下に収まります。

返り値の部分を下記のようにすると2行で済んでしまいます。

const returnDayForTechniques = (value) => {
    const returnObj = {1: "Monday",2: "Tuesday",3: "Wednesday",4: "Thursday",5: "Friday",6: "Saturday",7: "Sunday"};
    return returnObj[value] ?? "the value is invalid."
}

console.log(returnDayForTechniques(4));
// Thursday

一行で済ます場合は下記のように記載すると良いかと思います。

const returnObj = day => ({1: "Monday",2: "Tuesday",3: "Wednesday",4: "Thursday",5: "Friday",6: "Saturday",7: "Sunday"}[day] ?? "the value is invalid.");

console.log(returnObj(4));
// Thursday

20行あった条件式が1行で書くことができました。

最後に

いかがでしたでしょうか。
使い慣れたif文やswitch文で評価するのではなく、KeyValueペアのオブジェクトを用意して処理するとコード数が減り、とてもすっきりするようになります。

是非参考までに