はじめに
この記事では、TypeScriptにおける条件分岐について解説します。
if-else
TypeScriptにおけるif-else文は以下のように記載します。
if (score === 0) {
// scoreが0の場合の処理
} else {
// scoreが0以外の場合の処理
}
else if文も使用できます。
if (score === 100) {
// scoreが100の場合の処理
} else if (score === 50){
// scoreが50の場合の処理
} else {
// scoreが100もしくは50以外の場合の処理
}
TypeScriptのif-elseは文です。
式ではないので、以下のように条件分岐を変数に代入することはできません。
(Kotlinだとできますが、TypeScriptはできません)
const result = if (score > 100) "OK" else "NG";
上記のように、式で書きたい場合は三項演算子を用います。
const result = score > 100 ? "OK" : "NG";
三項演算子が分からない方は以下をご覧ください。

上記をif-else文で書くと以下のようになります。
let result;
if (score > 0) {
result = "OK";
} else {
result = "NG";
}
switch
TypeScriptではswitch文でも条件分岐を行うことができます。
const language = "TypeScript";
switch (language) {
case "TypeScript":
console.log("TypeScript");
break;
case "JavaScript":
console.log("JavaScript");
break;
default:
console.log("その他の言語");
case文は連続して書くこともできます。
const language = "TypeScript";
switch (language) {
case "TypeScript":
case "JavaScript":
console.log("TypeScript or JavaScriptです");
break;
case "Python":
case "Java":
console.log("Python or Javaです");
break;
default:
console.log("その他の言語");
break;
switchは厳密等価演算
switch文では、値の比較に使用されるのは等価演算(==)ではなく、厳密等価演算(===)になります。
switchのフォールスルー問題
TypeScriptのswitch文のcase文には、分岐を抜けさせる働きがありません。
分岐を抜けるには、breakが必要です。breakを書かない場合、次の分岐も実行されます。
上記の挙動をフォールスルーと言います。
例えば以下のような場合、”TypeScript”と”JavaScript”が出力されてしまいます。
let language = "TypeScript";
switch (language) {
case "TypeScript":
console.log("TypeScript");
case "JavaScript":
console.log("JavaScript");
}
フォールスルーはバグの原因になりかねます。基本的には全てのcase文(default文も)にbreak文をつけましょう。
TypeScriptではコンパイラオプションnoFallthroughCasesInSwitchをtrueにすると、フォールスルーを警告するようになります。
このオプションは有効化すると良いでしょう。
caseの変数スコープ
TypeScriptのcase文には基本的に変数のスコープがありません。
以下のような場合コンパイルエラーとなります。
let language = "TypeScript";
switch (language) {
case "TypeScript":
const name = "TypeScript";
// Cannot redeclare block-scoped variable 'name'.
break;
case "JavaScript":
const name = "JavaScript";
// Cannot redeclare block-scoped variable 'name'.
break;
}
上記を回避する方法はあります。
case文に変数スコープを作るには、「{ }」でcase節を囲みます。
let language = "TypeScript";
switch (language) {
case "TypeScript": {
const name = "TypeScript";
// Cannot redeclare block-scoped variable 'name'.
break;
}
case "JavaScript": {
const name = "JavaScript";
// Cannot redeclare block-scoped variable 'name'.
break;
}
}
まとめ
この記事ではTypeScriptにおける条件分岐について解説しました。
是非、いいねやコメントをお願いします。
コメント