Swift Playground - コードを学ぼう2【変数】Part 2

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

Swift Playground - コードを学ぼう2【変数】Part 2

ループの条件に変数を使おう

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

「コードを学ぼう2」の第1チャプタ「変数」のレッスンを3回に分けて解説しています。今回はその Part 2 です。

  • レッスン1〜3:前回の  Part 1 で取り上げ、変数の基本的な使い方を学びました。
  • レッスン4〜5:この記事で解説します。変数を while ループの条件に使ってコーディングしていきましょう。
  • レッスン6〜8:次回の Part 3 では、定数について説明し、変数との使い分けを学習します。

変数のレッスン1〜3は実習済みですか?まだの方は  Part 1 の記事からご覧ください。

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

レッスンのポイント

前回の Part 1 で学んだことの復習も兼ねて、レッスンを始める際に知っておきたいポイントを下にまとめました。

  • 変数とは、値を入れる名前付きの箱のようなものです。
  • 新しく変数を作るときは、キーワード var(ヴァー)を使って宣言します。
  • 変数の値は、あとから変更することができます。
// 変数を宣言する
var 変数の名前 = 最初に入れる値

// 変数に新しい値を代入する
変数の名前 = 新しい値

今回練習するのは、while ループの条件に変数を使うコードの書き方です。 値を上書きできるという変数の特徴を利用して、「変数の値が 〇〇 になるまで繰り返す」という文を書いていきます。

では、次のセクションからレッスン開始です!

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

レッスン4「7つの宝石を集める」

【目標】

  • 繰り返す条件に変数を指定する
  • while ループで繰り返す
Swift Playground/コードを学ぼう2/変数/7つの宝石を集める
Swift Playground/コードを学ぼう2/変数/7つの宝石を集める

課題解決の流れ

1. 宝石を7つ集めるまで繰り返そう
このステージは、宝石がランダムなタイミングで現れます。真ん中の道を往復しながら、宝石を7つ集めましょう。

「宝石カウンターが7より小さい間は繰り返す」という while ループで、集めた宝石の数が7になるまでホッパーを動かし続けます。「より小さい」を表すのは、比較演算子 < です。

  • gemCounter < 7:宝石カウンターの値が7より小さい

集めた宝石の数を記録する変数 gemCounter を宣言してから、while ループを入力してください。

// 変数を宣言する
var gemCounter = 0

// 宝石カウンターが7より小さい間は繰り返す
while gemCounter < 7 {
	
}

2. 宝石を集めながら往復しよう
if 文でマスの状態を確認しながら1歩ずつ進みましょう。宝石があったら取って、変数の値を1増やします。行き止まりになったら向きを変えて、行ったり来たりできるようにします。

while gemCounter < 7 {

	// 宝石の上にいるなら	
	if isOnGem {
		//宝石を取って、変数を1増やす
		collectGem()
		gemCounter = gemCounter + 1
	}

	// 行き止まりなら
	if isBlocked {
		// 後ろを向く
		turnRight()
		turnRight()
	}

	// 進む
	moveForward()

}

宝石を7つ集めたら、条件 gemCounter < 7 が false になるので、ループ終了です。

3. コードを実行しよう
「コードを実行」を押して動きを確かめましょう。宝石カウンターの値が7になるまで宝石を集められたら、ステージクリアです!

// コード正解例

var gemCounter = 0

while gemCounter < 7 {
	if isOnGem {
		collectGem()
		gemCounter = gemCounter + 1
	}
	if isBlocked {
		turnRight()
		turnRight()
	}
	moveForward()
}
ステージをクリアする動き
ステージをクリアする動き

レッスン5「3つの宝石と4つのスイッチ」

【目標】

  • 自分で変数を作る
  • 2つの変数を使う
Swift Playground/コードを学ぼう2/変数/3つの宝石と4つのスイッチ
Swift Playground/コードを学ぼう2/変数/3つの宝石と4つのスイッチ

課題解決の流れ

1. 変数を作ろう
このステージは、コードを実行するたびに宝石と切れているスイッチがランダムに現れます。宝石を3つだけ集めて、スイッチを4つだけオンにするコードを書いていきましょう。

集めた宝石の数と、オンにしたスイッチの数を数えるために、変数は2つ必要です。宝石の数を記録する変数は gemCounter、スイッチの数を記録する変数は switchCounter という名前で宣言しましょう。どちらも初期値は 0 です。

  • gemCounter:宝石カウンター
  • switchCounter:スイッチカウンター
// 変数を宣言する
var gemCounter = 0
var switchCounter = 0

2. 宝石とスイッチの数をクリアするまで繰り返そう
宝石を3つ取ってスイッチを4つオンにするまで、while ループで動かし続けます。条件は次のようになります。

  • gemCounter < 3:宝石カウンターの値が3より小さい
  • switchCounter < 4:スイッチカウンターの値が4より小さい

「または」を意味する OR 演算子 || を使って、どちらかの条件が成立する間は繰り返しましょう。

/* 宝石カウンターが3より小さい間、
 または、スイッチカウンターが4より小さい間は繰り返す */
while gemCounter < 3 || switchCounter < 4 {
	
}

ステージの前半で宝石を3つ取ったあとは、条件 gemCounter < 3 が false になりますが、もう1つの条件 switchCounter < 4 が true なのでループは続きます。

OR 演算子については以下の記事を参考にしてください。

Swift Playground - コードを学ぼう1【論理演算子】Part 2
Swift Playground「コードを学ぼう1」で論理 AND / OR 演算子について学習しましょう。本記事ではプログラミング初心者にも分かりやすいように解説し、コードの正解例を掲載しています。

3. 宝石を取ってスイッチを切り替えよう
ここからは、while ループの中身を書いていきます。

if / else if を使って、宝石を取るか、スイッチを切り替えるかを判断します。「カウンターの値」と「マスに何があるか」の両方を調べる必要があるので、「かつ」を意味する AND 演算子 && を使って条件を指定しましょう。

  • gemCounter < 3 && isOnGem:宝石カウンターが3より小さい、かつ、宝石の上にいる
  • switchCounter < 4 && isOnClosedSwitch:スイッチカウンターが4より小さい、かつ、切れているスイッチの上にいる

条件を満たす場合は、宝石を取る、またはスイッチを切り替えて、それぞれのカウンターを1ずつ増やします。

while gemCounter < 3 || switchCounter < 4 {

	// 宝石を取る条件を満たすなら
	if gemCounter < 3 && isOnGem {
		// 宝石を取って、宝石カウンターを1増やす
		collectGem()
		gemCounter = gemCounter + 1

	// スイッチを切り替える条件を満たすなら
	} else if switchCounter < 4 && isOnClosedSwitch {
		// スイッチを切り替えて、スイッチカウンターを1増やす
		toggleSwitch()
		switchCounter = switchCounter + 1
	}
	
}

宝石を3つ取ったあとは、宝石を取る条件の1つである gemCounter < 3 が false になるので、宝石の上にいても宝石は取りません。

4. 方向転換しながら進もう
行き止まりになったら向きを変えましょう。右に向く場合と左に向く場合があるので、if / else if で条件分岐し、正しく方向転換してください。そして、 moveForward() で1マスずつ進むようにします。

while gemCounter < 3 || switchCounter < 4 {
    if gemCounter < 3 && isOnGem {
        collectGem()
        gemCounter = gemCounter + 1
    } else if switchCounter < 4 && isOnClosedSwitch {
        toggleSwitch()
        switchCounter = switchCounter + 1
    }

	// 前と左が行き止まりなら、右を向く
    if isBlocked && isBlockedLeft {
        turnRight()

	// 前が行き止まりなら、左を向く
    } else if isBlocked {
		turnLeft()
	}

	// 進む
    moveForward()
}
行き止まりになったら右または左を向いて進む
行き止まりになったら右または左を向いて進む

5. コードを実行しよう
「コードを実行」を押して動きを確かめましょう。宝石を3つ取ってスイッチを4つオンにできたら、ステージクリアです!

// コード正解例

var gemCounter = 0
var switchCounter = 0

while gemCounter < 3 || switchCounter < 4 {
    if gemCounter < 3 && isOnGem {
        collectGem()
        gemCounter = gemCounter + 1
    } else if switchCounter < 4 && isOnClosedSwitch {
        toggleSwitch()
        switchCounter = switchCounter + 1
    }
    if isBlocked && isBlockedLeft {
        turnRight()
    } else if isBlocked {
		turnLeft()
        }
    moveForward()
}

まとめ

今回は、Swift Playground の「コードを学ぼう2」で、変数を while ループの条件に使う書き方を学習しました。

変数に格納する値はコードの途中で変えることができるので、変数を条件にして「動かし続けるのか、止めるのか」を制御することができます。今回は gemCounter = gemCounter + 1 などの文で値が1ずつ変わっていくようにしました。もしこの文を書き忘れてしまうと、いつまで経っても変数の値が変化せず、無限ループになってしまう場合があるので注意しましょう!

次回予告

次のレッスンでは定数について紹介します。変数と定数は似ているように見えますが、きちんと使い分けることが大切です。変数との違いを理解し、変数と定数を両方使ってコーディングできるようになりましょう。

次の記事(準備中) →

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

SNS で Pyxofy とつながりましょう! LinkedIn・ Threads・Bluesky・ Mastodon・ X (Twitter) @pyxofy・ Facebook

関連記事

Swift Programming
Swift Playgrounds アプリで学ぶ初心者向けのコーディングチュートリアルを解説しています。
スクラッチプログラミング - フラッピーゲームのつくりかた
フラッピーバード風(ふう)のゲームを Scratch でつくる方法(ほうほう)を紹介(しょうかい)します。マウスやタッチで操作(そうさ)するので、キーボードなしのタブレットなどでもあそぶことができるモバイル対応(たいおう)のゲームです。
JavaScript - ダイアログの表示方法 - alert(), confirm(), prompt()
ポップアップで表示するダイアログを3つ紹介します。ユーザーに対してメッセージを表示する alert()、確認をする confirm()、入力を求める prompt() の使い方を学びましょう。
CSS Art - CSS shape() & Gradients: Create an Isometric Hot Air Balloon - Part 1
Colorful hot air balloons against a sky blue background are majestic! Learn, step by step, how to create one using the CSS shape() function.
CSS Animation – Changing Color
Viva Magenta, Molten Metallic or Tranquil Blue? You’ll learn how to use colors and more with CSS in this step-by-step article.