Swift Playground - コードを学ぼう1【条件分岐コード】Part 1

Swift Playground「コードを学ぼう1」で条件分岐コードについて学習しましょう。本記事ではプログラミング初心者にも分かりやすいように解説し、コードの正解例を掲載しています。

Swift Playground - コードを学ぼう1【条件分岐コード】Part 1

条件分岐の使い方を学ぼう

プログラミング言語 Swift を楽しく体験できる Swift Playground で、コーディングの基礎を学びましょう。

今回紹介するのは、「コードを学ぼう1」の第4チャプタ「条件分岐コード」です。全部で7つのレッスンを、Part 1・Part 2 の2回に分けて解説していきます。

  • レッスン1〜4:この記事で取り上げます。条件分岐コードの基本的な使い方を練習していきましょう。さらに、条件分岐コードと合わせて知っておきたい truefalse の意味についても簡単に説明します。
  • レッスン5〜7:次回の Part 2 で解説し、条件分岐コードを関数やループと組み合わせる課題に取り組みます。

第3チャプタの「for ループ」は実習済みですか?まだの方は以下の記事からご覧ください。

Swift Playground - コードを学ぼう1【for ループ】Part 1
Swift Playground「コードを学ぼう1」で for ループの使い方を学習しましょう。本記事ではプログラミング初心者にも分かりやすいように解説し、コードの正解例を掲載しています。

レッスンのポイント

条件分岐は、「もし A なら、B をする」というように、条件に応じてやることを変える仕組みです。この仕組みを使って書くコードのことを if 文(イフぶん)と呼びます。

このチャプタでは、以下の3パターンの条件分岐コードを学んでいきます。

1. if
キーワード if(イフ)の後ろに条件を指定し、その条件を満たす場合は { } 内の処理を実行します。

// if

if 条件 {
    // もし条件を満たすなら、この処理を実行する...
}

2. if / else if
if
に続けて else if(エルス・イフ)で別の条件を指定し、それぞれの条件でやることを分けます。

// if/else if

if 条件1 {
    // もし条件1を満たすなら、この処理を実行する...
} else if 条件2 {
    // 条件1を満たさず条件2を満たすなら、この処理を実行する...
}

3. if / else
if
のあとに else(エルス)を追加し、条件を満たす場合と満たさない場合で処理を分けます。

// if/else

if 条件 {
    // もし条件を満たすなら、この処理を実行する...
} else {
    // 条件を満たさないなら、この処理を実行する...
}

では、次のセクションからレッスン開始です。 Byte を正しく動かすためのコードを書いていきましょう!

※ この記事で紹介しているコードは、あくまで一つの例です(動作確認 Swift Playground 4.7)。プログラミングでは、同じ動きを作る方法がいくつもあります。いろいろなやり方を試しながら、自分なりの答えを見つけてみてください。

レッスン 1「スイッチを調べる」

【目標】

  • if 文の使い方を知る
  • 条件に応じてやることを分ける
Swift Playground/コードを学ぼう1/条件分岐/スイッチを調べる
Swift Playground/コードを学ぼう1/条件分岐/スイッチを調べる

課題解決の流れ

1. スイッチの ON / OFF を確認しよう
はじめに、コードを何も書かずに「コードを実行」を何回か押してみましょう。実行するたびにスイッチの ON と OFF がランダムに変わることを確認してください。

スイッチがランダムに切り替わる
スイッチがランダムに切り替わる

このステージでは、入っているスイッチはそのままにして、切れているスイッチだけを切り替えられるようにします。スイッチの状態に合わせて Byte の行動を変えるコードを書いていきましょう。

2. スイッチまで進もう
まずは、2マス進んで1つ目のスイッチまで移動します。

// 2マス進む
moveForward()
moveForward()

3. if を追加しよう
次に、ショートカットバーから if を選んでください。ショートカットバーから選択すると、if 文の構文(書き方の決まり)が自動的に入るので簡単です!

// ifを入力
if condition {
    code
}

4. 条件を入力しよう
すべてのスイッチをオンにできるように、「もし切れているスイッチの上にいるなら、スイッチを切り替える」という意味の if 文を作っていきましょう。

スイッチを切り替えるための条件を condition の部分に入力します。条件もショートカットバーから選択できるので、isOnClosedSwitch を選んでください。

  • isOnClosedSwitch:イズ・オン・クローズド・スイッチ「切れているスイッチの上にいる」
// 条件を入力
if isOnClosedSwitch {
    code
}

5. 切れているスイッチだけを切り替えよう
続けて、code の部分を入力していきます。

「切れているスイッチの上にいる」という条件を満たすときに実行するのは toggleSwitch() です。toggleSwitch() は、切れているスイッチの上で使うとスイッチは ON に、入っているスイッチの上で使うとスイッチは OFF になるんでしたね。

if isOnClosedSwitch {
    toggleSwitch() // 条件を満たす場合に実行する処理
}

「もし切れているスイッチの上にいるなら、スイッチを切り替える」という if 文ができました。オンのスイッチの上にいるときは条件が満たされないので、toggleSwitch() は無視され、Byte は何もしません。

6. 2つ目、3つ目のスイッチを切り替えよう
同じように、2つ目と3つ目のスイッチが切れていたらオンにできるよう、コードを追加しましょう。

// 2つ目のスイッチ
moveForward()         // 次のスイッチへ進む
if isOnClosedSwitch { // スイッチが切れていることを確認する
    toggleSwitch()    // スイッチが切れているなら切り替える
}

// 3つ目のスイッチ
moveForward()         // 次のスイッチへ進む
if isOnClosedSwitch { // スイッチが切れていることを確認する
    toggleSwitch()    // スイッチが切れているなら切り替える
}

7. コードを実行しよう
「コードを実行」を押して動きを確かめます。オンのスイッチの上では何もせず、切れているスイッチをオンにできたら、ステージクリアです!

// コード正解例

moveForward()
moveForward()
if isOnClosedSwitch {
    toggleSwitch()
}
moveForward()
if isOnClosedSwitch {
    toggleSwitch()
}
moveForward()
if isOnClosedSwitch {
    toggleSwitch()
}
オフのスイッチだけを切り替える
オフのスイッチだけを切り替える

レッスン 2「else if を使う」

【目標】

  • if / else if の使い方を知る
  • 2つの条件でやることを分ける
Swift Playground/コードを学ぼう1/条件分岐/else ifを使う
Swift Playground/コードを学ぼう1/条件分岐/else ifを使う

課題解決の流れ

1. 宝石とスイッチの位置を確認しよう
はじめに、コードを何も書かずに「コードを実行」を何回か押してみましょう。実行するたびに宝石とスイッチの位置がランダムに変わることを確認してください。スイッチが2つ現れて宝石は出てこないパターンもあります。

宝石またはスイッチがランダムに現れる
宝石またはスイッチがランダムに現れる

このステージでは、1マス進むごとにスイッチがあるのか宝石があるのかを調べます。切れているスイッチがあったらオンにする、宝石があったら取る、というように if / else if を使ってコーディングしていきましょう。

2. 1マス進もう
まずは1マスだけ進みます。進んだ先のマスにあるのは、宝石かスイッチのどちらかです。

// 1マス進む
moveForward()

3. ifelse if を追加しよう
次に、if / else if を使って次のような意味の文を作っていきます。

  • もし切れているスイッチの上にいるなら、スイッチを切り替える
  • そうではなくて、もし宝石の上にいるなら、宝石を取る

ショートカットバーから if を選び、続けて else if を選んで if のあとに追加してください。

if condition { // ifを入力
    code
} else if condition { // else ifを入力
    code
}

4. if の条件と処理を入力しよう
「もし、切れているスイッチの上にいるなら、スイッチを切り替える」という文は、1つ前のレッスンでやったとおりです。

// ifの条件と実行する処理を入力
if isOnClosedSwitch {
    toggleSwitch()

} else if condition {
    code
}

5. else if の条件と処理を入力しよう
else if では、「そうではなくて、もし宝石の上にいるなら、宝石を取る」という意味にします。宝石の上にいるかどうかを調べるために使うのは isOnGem です。これが else if の条件になります。

  • isOnGem:イズ・オン・ジェム「宝石の上にいる」

condition の部分に isOnGem を、code の部分に collectGem() を入力しましょう。

if isOnClosedSwitch {
    toggleSwitch()
    
} else if isOnGem { // 条件を入力
    collectGem()    // 実行する処理を入力
}

6. 次のマスでも同じことをしよう
さらに1歩進んで、同じようにしましょう。

// 2マス目
moveForward()
if isOnClosedSwitch {
    toggleSwitch()
} else if isOnGem {
    collectGem()
}

7. コードを実行しよう
「コードを実行」を押して動きを確かめます。宝石またはスイッチがあることを確認し、宝石を取ってスイッチをオンにできたらステージクリアです!

// コード正解例

moveForward()
if isOnClosedSwitch {
    toggleSwitch()
} else if isOnGem {
    collectGem()
}
moveForward()
if isOnClosedSwitch {
    toggleSwitch()
} else if isOnGem {
    collectGem()
}

レッスン 3「条件分岐コードをループする」

【目標】

  • if / else iffor ループを組み合わせる
  • 2つの条件でやることを分ける
Swift Playground/コードを学ぼう1/条件分岐/条件分岐コードをループする
Swift Playground/コードを学ぼう1/条件分岐/条件分岐コードをループする

課題解決の流れ

1. 入力済みのコードを確認しよう
このレッスンでは、以下のコードがすでに入力されています。

// 入力済みのコード

for i in 1 ... number {
    moveForward()
}

moveForward() で前へ進む以外に、for ループでどんな処理を繰り返せば良いかを考えましょう。

このステージもコードを実行するたびに宝石とスイッチがランダムに現れます。前のレッスンで学んだように、切れているスイッチがあればオンにし、宝石があれば取る、という条件分岐コードを for ループの中に書いていきます。

2. ifelse if を追加しよう
if / else if を追加して、次のような文を作りましょう。

  • もし切れているスイッチの上にいるなら、スイッチを切り替える
  • そうではなくて、もし宝石の上にいるなら、宝石を取る
for i in 1 ... number {
    moveForward()

    // if, else ifで条件分岐する
    if isOnClosedSwitch {
        toggleSwitch()
    } else if isOnGem {
        collectGem()
    }

}

3. 繰り返す回数を入力しよう
for ループで繰り返す回数は12回です。number の部分を選択して、12 を入力しましょう。

4. コードを実行しよう
「コードを実行」を押して動きを確かめます。1マス進むごとに切れているスイッチまたは宝石があるかを調べ、スイッチをオンにして宝石を取ったらステージクリアです!

// コード正解例

for i in 1 ... 12 {
    moveForward()
    if isOnClosedSwitch {
        toggleSwitch()
    } else if isOnGem {
        collectGem()
    }
}

レッスン 4「階段を上がる条件を探す」

【目標】

  • if / else の使い方を知る
  • ブール値を知る
Swift Playground/コードを学ぼう1/条件分岐/階段を上がる条件を探す
Swift Playground/コードを学ぼう1/条件分岐/階段を上がる条件を探す

課題解決の流れ

1. 入力済みのコードを確認しよう
このレッスンでは以下のコードがすでに入力されています。

// 入力済みのコード

for i in 1 ... 16 {
    if condition {

    } else {
        moveForward()
    }
}

ゴールにたどり着くには、直進だけでなく曲がって階段を上る必要があります。条件を満たさなかった場合の else では moveForward()「進む」が実行されるため、if の方では左に曲がる条件を設定し、階段を上れるようにしていきましょう。

2. 左に曲がるためには?
Byte を左向きにする方法を考えてみてください。

曲がり角のマスには必ず宝石があります。宝石があることを条件にして、「もし、宝石の上にいるなら、左を向く」という文にすれば、階段の方を向くことができますね。

if の条件に isOnGem を、実行する処理に turnLeft() を入力しましょう。

for i in 1 ... 16 {
    if isOnGem {   // もし宝石の上にいるなら
        turnLeft() // 左を向く
        
    } else {
        moveForward()
    }
}

3. コードを試してみよう
試しにここまでのコードで Byte を動かしてみましょう。

  • 何もないマスでは elsemoveForward() が実行され、Byte は1マス進みます。
  • 宝石のマスに到着すると if の条件が満たされるので、turnLeft() で左を向きます。
  • 宝石のマスの上で turnLeft() を繰り返してクルクルと回転し続けます。
もし宝石の上にいるなら左を向く
もし宝石の上にいるなら左を向く

Byte が回り続けてしまう理由は、「宝石の上にいる」という条件がずっと満たされてしまっているからです。

4. 1回だけ左を向くようにしよう
角を曲がるときは1回だけ左を向けば良いですね。そのためには、「宝石の上にいる」という条件が成立しなくなるようにします。turnLeft() のあとに collectGem() を追加して、宝石を取りましょう。

for i in 1 ... 16 {
    if isOnGem {
        turnLeft()
        collectGem() // 宝石を取る
        
    } else {
        moveForward()
    }
}

5. 繰り返す回数は?
for ループで繰り返す回数は 16 になっています。ゴールまでのマスの数は全部で12なのに、なぜ16回も繰り返すのでしょうか?理由は次のとおりです。

  • for ループの1回目は、スタート地点で実行されます。
  • 宝石のあるマスでは、if の「左を向いて宝石を取る」処理だけが行われるわけではありません。
  • 宝石を取ったあとに同じマスで次のループが続き、else の処理によって前に進みます。
  • つまり、宝石のある角のマスでは for ループが合計2回実行されることになります。
  • そのため、全体としては16回繰り返します。

6. コードを実行しよう
「コードを実行」を押して動きを確かめましょう。1マスずつ進んで宝石をすべて集められたら、ステージクリアです!

// コード正解例

for i in 1 ... 16 {
    if isOnGem {
        turnLeft()
        collectGem()
    } else {
        moveForward()
    }
}

ブール値とは? true / false

さて、今回のレッスンでは、説明文の中に「ブール値」(ブールち)という新しい言葉が出てきましたね。ここからは、ブール値について簡単に説明していきます。

isOnGem(宝石の上)のような条件は、いつも、当てはまる場合がtrue(真)、当てはまらない場合がfalse(偽)の、どちらかの値になります。このような値をブール値といいます。
引用:Swift Playground

プログラムで扱う値には様々なものがあります。分かりやすい例では、1、2、100などは「数値」という値です。if 文の条件として使われる値(今回の場合 isOnGem)は「ブール値」(論理値)という値です。

ブール値とは、次の2つのどちらかになる値のことをいいます。

  • true(トゥルー)、真(しん)
  • false(フォルス)、偽(ぎ)

例えば、先ほどのコードのように、if 文の条件を isOnGem にした場合、true / false は次のようになります。

  • 宝石の上にいる場合:
    条件に当てはまる? → はい → isOnGemtrue である
  • 宝石の上にいない場合:
    条件に当てはまる? → いいえ → isOnGemfalse である
Swift - ブール値 true, false
Swift - ブール値 true, false

条件が true であれば if の処理が実行され、false であれば else の処理が実行されます。

// ブール値 true/false

for i in 1 ... 16 {
    if isOnGem {      // isOnGemはブール値(trueまたはfalseになる)
        turnLeft()    // trueの場合に実行する処理
        collectGem()  // trueの場合に実行する処理
    } else {
        moveForward() // falseの場合に実行する処理
    }
}

まとめ

今回は、Swift Playground の「コードを学ぼう1」で、条件分岐コードを学習しました。

条件分岐は、指定された条件に応じてやることを分けるための仕組みで、プログラミングでよく使われます。

  • if:条件を満たす(true)ときだけ特定の処理を行う
  • if / else if:複数の条件を指定して処理を分ける
  • if / else:条件を満たす場合(true)と満たさない場合(false)で処理を分ける
  • if 文の条件に使うのは「ブール値」というもので、true または false のどちらかになり、それに応じて実行する処理が分かれる

最後まで読んでいただき、ありがとうございます。この記事をシェアしてくれると嬉しいです!

SNS で Pyxofy とつながりましょう! LinkedInThreadsBlueskyMastodon X (Twitter) @pyxofyFacebook

関連記事

スクラッチプログラミング - けしゴムおとしゲーム|モバイル対応(たいおう)
マウスやタッチでけしゴムをひっぱってとばす「けしゴムおとし」を Scratch でつくります。キーボードをつかわずにけしゴムをうごかすので、タブレットなどでもあそぶことができるゲームです。
JavaScript - 条件分岐の基本 - if 文の書き方と true, false の意味
if 文は、「もし〇〇ならAをする、そうじゃなかったらBをする」のように、条件によって処理を分岐させるための文です。if 文を理解する際に必要になる、真理値(真偽値)の true と false についても、一緒に学んでいきましょう。
CSS Art – How to Make a Game Character – Kirby
Pink all over and packed with powerful moves. Unforgettable starry eyes. Join us in creating the iconic Kirby in this article, step-by-step.
CSS Animation – steps() Function Multi-Step Animation
Smooth animations are delightful to look at, but sometimes, you may want to control each keyframe with CSS. Learn how in this step-by-step article.