[progate] JavaScript コースⅠ 「条件分岐」のまとめ

[progate] JavaScript Ⅰ,レビュー

三島 某

JavaScript コースⅠの導入も最後となります。条件分岐とプログラミングっぽい感じになってきました。本章も今後のコースをスムーズに進めるためのチュートリアルなので、肩の力を抜いて進めていきましょう。

JavaScript コースⅠの構成での「条件分岐」の位置付け

  • 文字列と数値
  • 変数と定数
  • 条件分岐 ← 今回はここ

まとめ

  • プログラムの肝というべき条件分岐を体験できます。
  • これまでの文字列の操作、変数と条件分岐を組み合わせて小さなプログラムを組みことができます。

「条件分岐」の解説

本セクションでは、前回に引き続きJavaScriptの導入部として、プログラミングの基礎について学んでいきます。

  1. if文
  2. 真偽値と比較演算子(1)
  3. 真偽値と比較演算子(2)
  4. else
  5. else if
  6. 複数の条件式
  7. switch文(1)
  8. switch文(2)

割とボリュームがありますが、一つづつはシンプルな内容です。でも焦らずに進めることをお勧めします。

ここの部分はどんなにゆっくり進めても元はしっかりとれます。

if文

if文の書き方と最もシンプルな条件分岐の書き方を学習します。ここではif文を書くという行為を体験しましょう!

本演習の場合は、判定に使っている定数(const)の値を変更を変えたら、コンソールの出力が変わった!という
気づきにあるはずなのですが。

学習文法/用語

if文

真偽値と比較演算子

2回連続で条件式について学びます。これまでとはだいぶ数学(算数)っぽい表現が出始めるので、しんどくなってきます。

道具の使い方って決まっているものですから、慣れてしまえば大丈夫。(鍋で野菜炒めをしたりしませんね)

  • 大小を比べるのは、数字(金額、年齢、何かの回数 etc)と日付
  • 2つの数字を比較して同じかを比較する場合は「==」
  • 2つの文字列を比較して同じかを比較する場合は「===」

ちょっと面倒かもしれませんが、今の所は「ふむふむ」と進めていきましょう。ここで大事なのは

「そうか、そういう記号があるのか!」

と思うことです。暗記も理解ももう少し先で十分です。

学習文法/用語

比較演算子 ご一同様

else と else if

ここまでは条件が満たされた場合にのみ実行するプログラムの書き方を学習してきました。

条件が満たされない場合に実行するプログラムとして「else」を学習します。また複数の条件を判定する「else if」

も合わせて学習します。シンプルな条件の場合は今のところ、難易度は高くありません。

例えば、こんな感じの場合だと

「お酒の購入サイトの場合、購入者が未成年の場合は、エラーメッセージを画面に表示する必要があります。」

if (age >= 20){
    console.log(”購入ありがとうございます。”);   
}else{
    //ここは0歳から19歳までの人は全てこのソースコードを実行します。
    console.log(”お酒は二十歳になってから”);
}

条件に該当しないとはどういうことなのか?というテーマがあることをぼんやりと覚えてください。

学習文法/用語

else, else if

複数の条件式

if文で使用する「年齢が・・・」や「性別が女性の場合・・」を「条件式」と言います。

ただ実際のプログラムでは、「性別が男性で年齢が30歳代」の場合になどどんどん複雑になっていきます。

この時に使うものが「&&」や「||」とです。


この条件式はプログラムの本体ともいうべきものなので、ここでは割愛します・・・


そういうものもあるのね!


くらいに覚えておきましょう。すでに脳みそパンパンなはずなので。

学習文法/用語

&& 演算子 || 演算子

switch文

条件式に使う値によって細かく対応したい場合に用いるswtich文について2回にわたって学習します。

解説はProgateに記載していますので参照してください。

ただ実際のプログラムではこんな流れとなるので、switch文は使いません。

  1. 信号の色とメッセージをデータベースに保存しておく
  2. 信号を点灯させる値を使ってデータベースに検索する。
  3. データベースの検索結果である、色とメッセージを表示する。

このようにすると分岐が必要ではなくなり、しかもメッセージを表示できます。

今は、まだswitch文を使って学習しても良いのですが、いつかこれは使わなくなるなということを頭の隅においておくと良いです。

学習文法/用語

switch文

「条件分岐」では学ばないこと

全体を通じて、条件分岐がなぜ必要なのか、なぜ重要なのかについて説明がありません。

というわけで、ここで条件分岐がどれほど重要なのかまとめてみたいと思います。

  • 以下のことを実現するのは、全て条件分岐です。
    > IDとパスワードが正しい場合のみ、ツイッターやブログサイトにログインできる。
    > 検索結果が0件の場合、検索条件を変更してほしいことを伝える。
  • プログラムの設計書のほとんどが条件分岐について書かれている。
  • ○○の場合を整理できるようになると、プログラムのみならず、実作業の効率がアップする。

このように条件分岐の把握はプログラマにとって重要な領域であると言えます。

今は、まだ理解しなくても良いと思いますが、そういう技術領域があることを知っておくと学習効率がアップしますので覚えておいてください。

参加ランキング

PVアクセスランキング にほんブログ村

[progate] JavaScript Ⅰ,レビュー