TypeScript - ネストされたif文:入門者のガイド
こんにちは、将来のプログラミングスーパースターたち!今日は、TypeScriptの魅力的な世界、ネストされたif文について一緒に掘り下げます。プログラミングが新しいあなたも心配しないでください。この冒険のなかであなたの親切なガイドとしてお手伝いします。お気に入りの飲み物を用意して、リラックスして、一緒にこの旅に出発しましょう!
ネストされたif文とは?
深淵には飛び込む前に、まず基本から始めましょう。あなたがプレイしているビデオゲームで、キャラクターが複数の決定を行うとしましょう。それぞれの決定は次の選択肢に繋がります。これがプログラミングにおけるネストされたif文の概念です。決定の中に決定があります!
TypeScript(そして多くの他のプログラミング言語)では、if文を使ってコード内で決定を行います。一つのif文の中に別のif文を入れると、それを「ネストされたif文」と言います。
ネストされたif文を使う理由は?
「なぜこんなに複雑な決定が必要なのか?」と思っているかもしれません。ちょっとした話を聞いてください。
imagine you're creating a program for a coffee shop. You want to give a discount to customers, but it depends on two things: whether they're a regular customer and if they're buying more than 3 coffees. You could use nested if statements to check both these conditions. It's like asking, "Are they a regular? If yes, are they buying more than 3 coffees?"
カフェのプログラムを作成しているとしましょう。顧客にディスカウントを提供したいですが、それは彼らが定期的な顧客であるかどうかと、3杯以上のコーヒーを購入しているかどうかに依存します。ネストされたif文を使ってこの両方の条件をチェックすることができます。これは「彼らは定期的な顧客ですか?如是なら、3杯以上購入していますか?」と尋ねるようなものです。
それでは、TypeScriptでの書き方を見てみましょう!
ネストされたif文の構文
以下はネストされたif文の基本構造です:
if (condition1) {
// condition1がtrueの場合に実行するコード
if (condition2) {
// condition1とcondition2が両方trueの場合に実行するコード
}
}
これを見て驚かないでください!見た目より簡単です。以下に分解します:
- 外側の
if
文でcondition1
をチェックします。 -
condition1
がtrueの場合、最初のコードブロックに入ります。 - このブロックの内部で、別の
if
文でcondition2
をチェックします。 -
condition2
もtrueの場合、最も内側のコードブロックを実行します。
コーヒーショップのディスカウント例
カフェの話をコードで具体化してみましょう:
let isRegularCustomer: boolean = true;
let numberOfCoffees: number = 4;
if (isRegularCustomer) {
console.log("Welcome back! Let's check if you qualify for a discount.");
if (numberOfCoffees > 3) {
console.log("Great news! You get a 20% discount on your order.");
} else {
console.log("Buy one more coffee to get a 20% discount!");
}
} else {
console.log("Welcome! Consider joining our loyalty program for great discounts.");
}
このコードを分解すると:
-
isRegularCustomer
とnumberOfCoffees
という2つの変数を宣言します。 - 外側の
if
文で顧客が定期的な顧客かどうかをチェックします。 - それがtrueの場合、ウェルカムメッセージを表示し、内側の
if
文に進みます。 - 内側の
if
文で3杯以上購入しているかどうかをチェックします。 - 両方の条件がtrueの場合、ディスカウントメッセージを表示します。
- 定期的な顧客だが3杯以下購入している場合、もっと購入するよう勧めます。
- 定期的な顧客でない場合、忠诚度プログラムに加入するよう勧めます。
このコードを実行すると、両方の条件がtrueなのでディスカウントメッセージが表示されます!
エルズ...イフの梯子
それでは、エルズ...イフの梯子を使ってスキルを一段階上昇させましょう。複数の条件をチェックする場合に非常に便利です。
エルズ...イフの梯子的構文
以下のように見えます:
if (condition1) {
// condition1がtrueの場合に実行するコード
} else if (condition2) {
// condition2がtrueの場合に実行するコード
} else if (condition3) {
// condition3がtrueの場合に実行するコード
} else {
// どの条件もtrueでない場合に実行するコード
}
コーヒー温度の好みの例
エルズ...イフの梯子を使って、異なるコーヒー温度の好みを処理してみましょう:
let coffeeTemperature: number = 70; // 温度(セルシウス度)
if (coffeeTemperature > 80) {
console.log("Caution: Your coffee is extremely hot!");
} else if (coffeeTemperature >= 70) {
console.log("Your coffee is hot and ready to drink.");
} else if (coffeeTemperature >= 60) {
console.log("Your coffee is at a pleasant warm temperature.");
} else if (coffeeTemperature >= 50) {
console.log("Your coffee is getting cool, might want to drink it soon.");
} else {
console.log("Your coffee has gone cold. Would you like us to reheat it?");
}
この例では:
- コーヒーの温度を異なる閾値に対してチェックします。
- 温度に応じて異なるメッセージを表示します。
- どの条件も満たさない場合(50°C未満)、コーヒーが冷たいため再温めを提案します。
この構造により、複数のシナリオを効率的に処理できます。
ネストされたif文のベストプラクティス
最後に、ここまでに学んだことを纏めます。以下は、年間を通して学んだ黄金のルールです:
-
シンプルに保つ:深くネストしないように努めてください。3レベル以上になった場合は、コードをリファクタリングすることを検討してください。
-
明確な条件を使用する:
if (isHungry && timeIsPastNoon)
はif (a && b)
よりも明確です。 -
スイッチステートメントを検討する:同じ変数に対して複数の条件をチェックする場合は、スイッチステートメントが明確かもしれません。
-
早期リターンを使用する:時には早期リターンを使うことでコードをシンプルにできます。
以下に早期リターンの例を示します:
function checkAge(age: number): string {
if (age < 0) {
return "Invalid age";
}
if (age < 18) {
return "You're a minor";
}
if (age < 65) {
return "You're an adult";
}
return "You're a senior citizen";
}
これは複数のif-elseステートメントをネストするよりもクリーンです。
結論
おめでとうございます!あなたはTypeScriptのスキルを一段階上昇させ、ネストされたif文とエルズ...イフの梯子を学びました。これらはあなたのプログラミングツールキットにおける強力なツールですが、どんなツールも賢く使うことが重要です。
これらの概念を練習し、異なる条件で遊んでみてください。そうすることで、すぐに複雑な決定木を作成できるようになります。もしかしたら、次の大ヒットゲームや革命的なアプリを作るためにこれらのスキルを使うかもしれません!
codingを続け、学び続け、そして何より楽しみましょう!次回まで、あなたの近所の親切なプログラミング先生がお別れです。Happy TypeScripting!
Credits: Image by storyset