見出し画像

未経験者のための『コードを学ぼう』ガイド-2

Swift Playgroundsアプリの『コードを学ぼう』は、プログラミング未経験者が最初に取り組む教材としてとても良くできています。
アプリも教材も無料で老若男女に広くおすすめできるものです。

この記事は『コードを学ぼう』の副読本です。
コードを学ぼう』の各章を整理・解説し、より本格的なプログラミング学習に(立ち往生せず)進むことを目的としています。

在宅でできるスキルとして、プログラミングに興味を持っている人に向けて書きます。
複数の記事に分かれています、順に読み進んでください。

このシリーズの構成 ▶︎このnote
 未経験者のための『コードを学ぼう』ガイド-1
   ⬇︎
 iPadで『コードを学ぼう』
 Macで『コードを学ぼう』
   ⬇︎
▶︎未経験者のための『コードを学ぼう』ガイド-2
 未経験者のための『コードを学ぼう』ガイド-3

・画像クリックで拡大表示できます

iPad版 Playgrounds もMac版 Playgrounds も『コードを学ぼう』など教材の内容は同じです。

画面がiPadとMacでは少し違う部分があります。
この記事の画面キャプチャはライトモードのiPadで、文字サイズは少し大きくしています。
ダークモードで実行しているとライブビューには夜景を表示します。

画像1

説明の青い単語は用語集に載っている重要な用語です。
タップ/クリックすると説明を表示します。
最初のページでは コマンド が青く、説明を表示できることがわかります。
青い単語があったら、すべて説明を確認してください


1-1 コードを学ぼうの「章」について

コードを学ぼうの説明を始める前に、章とページの構成について確認します。

Playgroundsの教材はページが基本で、ページが集まり章を構成し、章があつまり教材を構成しています。
ページにも章にもすべてタイトルが付いています。
章の確認はiPadとMacでは少し違って来ます。

iPad版Playgroundsではページのタイトル表示をタップすると章とページの一覧を表示できます。
上下にスクロールでき、タップしたページを直接開くことができます。

画像3

Mac版Playgroundsではサイドバーを使って確認します。
(Mac版では「チャプタ」と表記しています)
クリックしたページを開くことができるのは共通です。

画像2

コードを学ぼう1の最初の章は「コマンド」です。
この記事では「コマンド」、「関数」、「for ループ」の章を解説します。


1-2 コマンド と 関数 (コードを学ぼう 1)

まず最初に二つの章「コマンド、関数」で体験する内容の予習をしましょう。

・ひとまとまりの処理に名前を付けて使うのが『関数』です
・関数はどのような処理なのかを定義します
・定義済みの関数は名前で呼び出します
・関数はプログラミング言語の基本的な要素です

「定義する」は英語では define 、「定義」は definition です。

関数は一連の手続きをひとまとめにし、他の関数と区別するためのユニークな名前を持ちます。

ユニーク』とは同じ値がない状態のことです。
このため、確実に区別できます。
(名前の場合、大文字と小文字も区別します)

関数は 名前() で呼び出します。
関数の名前に続けてカッコを書きます。
コードを学ぼう1 ではこれを「コマンド」(command)と呼んでいます。
最初のページから、いきなりコマンドを使っていましたが、見えない部分で対応する関数が定義されているのです。

定義されていない関数は使えません。
定義されている名前と同じ名前で呼び出します。
また定義されている名前と少しでも違う名前だと、定義された関数を使うことはできません。
見えない部分で定義されている関数や、画面のアニメーション・効果音・BGMなどを読み込むためコードを学ぼうの実行には最初に時間がかかります。
ページの切り替えにもしばらくしてから、BGMを再生しアニメーションが動き出すのは読み込みや最初の処理に時間がかかるためです。
「関数」は英語では function です。
エラーメッセージの中にfunctionがあったら関数に関係しているはずです。

詳しくは「コードを学ぼう2」に出てきますが関数のカッコは引数を書く場所で関数の目印です。

・・・


画像8

2 コマンドの章

プログラミングがはじめての人にコマンドの働きを実感してもらうための章です。
コード入力とその実行を体験してください。
楽しくはじめることができます。

目標を達成するとバイトくんが喜びます。
達成できない場合はヒントを見てください。

ステージを回転し、見やすい状態で移動する数を確認してください。

入力はショートカットバー/ショートカットリストから選ぶだけで可能です。
まだキーボードからの文字入力は必要ありません。

この章の用語 

コマンド、バグ、デバッグ 
どれもSwift言語の用語ではなく、一般的なコンピュータの用語です。

スイッチ、ワープ 
どちらもここではステージのアイテムの一つです。
コードを学ぼうの1と2だけの用語です。

コマンドの章各ページの概要

ページタイトルの後ろの「🔶」印は課題のページ、⏺は練習のページです。

課題のページではプログラミングの考え方やキーワードが説明されています。
練習ページは新しい項目はありません。
プログラミングの考え方に慣れるための練習です。
復習時には練習ページをとばしてもかまいません。
コマンドの章はすべて課題です。


2-1 コマンドを使う 🔶

二つのコマンドをどのように組み合わせるとどうなるかを体験します。
「ヒント」ボタンもぜひ使ってください。
コマンドはショートカットバー(Macではショートカットリスト)から選ぶと入力できます

「コードを実行」ボタンを押してもすぐに動かない場合がありますが心配いりません。(古い機種などデバイスの性能により差があります)

moveForward()とcollectGem()はコードを学ぼう専用のコマンドです。


2-2 新しいコマンドを追加する 🔶

最初のページの二つのコマンドに turnLeft() コマンドを追加して課題をクリアします。

turnLeft()もコードを学ぼう専用のコマンドです。


2-3 スイッチを切り替える 🔶

新しいスイッチを切り替えるコマンドを使って課題をクリアします。

toggleSwitch()もコードを学ぼう専用のコマンドです。


2-4 ワープの練習 🔶

ステージに新しい要素「ワープ」が登場します。
コマンドはこれまでのものを使います。
最初は一組だけですが抜け穴は同じ形状のもの同士がつながっています。

抜け穴から出た時、バイトがどちらを向いているかにも注目してください。


2-5 バグを見つけて直す 🔶

プログラムの間違いを見つけ正しく直す練習です。
どこがどのように正しくないか考えます。
行をドラッグ操作で移動する練習にもなっています。

行のドラッグ移動がうまくいかない場合は、行をカットし目的の場所にペーストしてください。
コード動作には影響しません。

バグ(コードのミス)は「正しいコマンドだが、使う順番や正しくないコマンドを書いてしまう」ことで発生します。


2-6 バグつぶしの練習 🔶

バグを見つけて修正する練習です。今度は二つのバグがあるようです。

バグを見つけ出し対策を考えるには、何度も実行することが欠かせません。
実行は何度くりかえしてもかまいません。
一つ残らずバグを見つけ出し対策して課題をクリアしてください。


2-7 最短の道順 🔶

一つの宝石を取りひとつのスイッチをonにする課題です。
この二つを実現するにはいろいろな書き方がありますが、その中で最短のものを考える練習です。

このステージには抜け道が二組あります。
同じ模様の抜け道にワープします。

・・・


画像9


3 関数の章

「関数」は英語で function です。
Swiftで関数を定義するためのキーワードは func です。

利用可能な部品を組み合わせて問題解決するのは、プログラミングの基本的な手法です。

この章の用語 

コーディング、コンポジション、関数、定義、パターン、呼び出す、分解


3-1 新しい挙動を作る 🔶

右を向くコマンドがない場合にこれまでのコマンドを組み合わせて右を向くようにします。
効率は悪くても目標を達成する方法をみつけます。


3-2 新しい関数を作る 🔶

turnRight()コマンドをこれまでのコマンドを組み合わせて作ります。

ここでは関数の定義と、実行の順番を確認します。
このページは入力済みのコードがあります。

画像4

関数を定義するコードが入力済みで、消したり編集したりできません。
入力済みのコードも「コードを実行」では実行されます

「コマンドを関数に追加」部分に関数の中身のコードを書きます。

実行の順序の注意 
関数定義(上画面の入力済みコードとそれに挟まれた部分)はコマンドが実行された場合だけ実行されます。
上画面のコードでは「タップしてコードを入力」部分から実行開始します。


3-3 集めて、切り替えて、繰り返す ⏺

新しいコマンドを定義します。処理のパターンを見つけひとつにまとめます。

ステージのバイトが歩く部分が増えています。
回転したり、少し上から見てどのように進むのか確認してください。

このページは最初の練習(⏺)のページですが、ぜひ入力し課題をクリアしてください。
関数の定義で関数名も入力します

関数の名前はキーボードからの入力が必要です

関数の名前を正しく入力すると「タップしてコードを入力」部分の入力で、ショートカットバー/ショートカットリストに自分で定義した名前も選べるようになります。

うまく動かない場合は、途中でも「■停止」ボタンで実行を止めることができます。

改行だけの行は実行に影響しません。
ひとつの辺を終え曲がり角に来たら、改行を入力しコードを一行あけると見やすくなります。


3-4 往復する ⏺

繰り返しのパターンを関数にまとめる練習です。

練習ページは新しいプログラミングの要素は登場しません。
でもコードを学ぼう 1 では、プログラミングに慣れるために欠かせない練習です。

入力済みのコードは前のページと同じですが、あなたが入力するコードでまったく違った動きを実現できます。

課題をクリアできるまで、何度でもコードを修正し実行してください。

課題をクリアできないときは、原因を自分の入力したコードから探してください。
時間がかかっても大丈夫です。

どうしてもクリアできない場合は後回しにしましょう
ほかのページを済ませた後ならすぐにわかるかもしれません。
気分転換もひつようです。
楽しく進めましょう。

3-5 パターンをネストする 🔶

パターンの中のパターンを見つけましょう。関数にまとめる応用です。

コードの行数が増えてきました。
複数の関数を定義し、使いこなしてください。

階段をクリアする関数の中でうしろを向く関数を使います。
ヒントを確認してから取り組んでください。


3-6 並んだ階段 🔶

関数の名前をわかりやすくします。関数にまとめる応用です。

入力済みの編集できないコードのほかに、すでにたくさんのコマンドが入力済みです。

まずコードを読み、バイトがどのような動きをするかじっくり考えてください。
次にコードを実行し、実際の動きとコードを読んだときの考えと比べてください。

課題をクリアするのに足りないコマンドを考え、追加してコードを実行してください。
宝石を一つずつ多く取るようにコマンドを追加し、課題クリアを目指してください。


3-7 パターンを探す ⏺

小さいパターンを見つけさらにその組み合わせを探す練習です。

このページには入力済みのコードが一行もありません。
ぜひ、すべてのコードを自分で入力し課題をクリアしてください。

「タップしてコードを入力」をタップ/クリックすると、ショートカットバー/ショートカットリストに func が並びます。
func を選ぶと

画像7

関数名の入力状態になります。

画像8

関数名を入力し、繰り返すコードを入力してください。


4 関数の少し詳しい説明

関数はまとまった処理、何度も使う処理をひとまとめにします。関数の例です。

func moveForward() {
   // 前方が同じ高さのブロックであれば1ブロック進むアニメーション
   // 前方のブロックが高ければぶつかったアニメーションを表示
   // 前方のブロックが低ければ落ちそうになるアニメーションを表示
}

関数の定義は func 関数名(引数) -> 戻り値の型 { 処理 } が基本的な形です。
この例では引数(ひきすう)は一つもなく、関数の型もありません。
処理に対応する部分は普通の場合何行もあります。
※引数は『コードを学ぼう2』で詳しくやります。

関数の呼び出し 
上記の関数を呼び出して使うには

moveForward()

のように使います。
「関数の呼び出し」は英語では call です。

コマンド 
コマンドは どこかで定義されている(または Swift言語が持っている)ものだけ使うことができます。
moveForward() などは『コードを学ぼう1』と『コードを学ぼう2』だけで使うことができます。
『コードを学ぼう』には各ページには表示されない大量のコードあります。
それらのコードで複雑なアニメーションなどを実現しています。
moveForward() はその中で定義されているので『コードを学ぼう』専用なのです。

コードの実行順序 
コード(プログラム)は最初の行から実行を開始し次々と行を実行していきます。
関数や型の定義(後から学びます)がある場合は実行順序がわかりにくい場合があります。

 { 処理 } を含む関数定義部分はコマンドを呼び出した時だけ実行されます。
通常の実行は関数定義を飛ばして実行しています。
関数を定義したページで「コードをステップ実行」して確認してください。

実行順の説明

func moveForward() {   // 関数が呼ばれる 【3️⃣】
  goOneStep()         // 【4️⃣】
}

var x = 0       // ここから実行される 【1️⃣】
moveForward()   // 次に実行 【2️⃣】
x = 20          // 関数の処理を実行してから実行 【5️⃣】

【】内の数字の順に実行します。

コードをステップ実行」するとどの行を実行しているのか確認できます。
ゆっくりステップ実行」は「コードをステップ実行」よりもゆっくり進むのでコードとバイトの動きを見比べるのに向いています。

画像13

プログラミング言語はこのように、自然言語とは違った部分があります。
コマンドと関数はどちらも基本的で重要なプログラミングの要素です。
すべてのページをやった後に、それぞれの「はじめに」を復習してください。

・・・


画像12


5 for ループの章

繰り返しはコンピュータの最も得意な処理です。

コンピュータは単調な繰り返し処理の自動化を目指し開発されました。

ループ(loop)は輪のことです。
ぐるぐる同じことを繰り返すイメージです。
この章ではSwiftの「for」キーワードの使い方を学びます。
繰り返しをうまく使うことでコードがシンプルになります。


5-1 ループを使う 🔶

繰り返しの回数を指定するforループを使ってコードを書きます。

このステージには4組の抜け道があります。
同じ模様の抜け道にワープします(ここでは色でも区別できます)。
ステージを回転や拡大して確認してください。

画像9

入力済みのコードは

for i in 1 ... number {
   // タップしてコードを入力
}

フォー 空白 アイ 空白 イン 空白 数字の1 空白 点三つ 空白 数値入力場所 空白 波かっこ 改行
です。
ここで forin はSwiftのキーワードで、{} は繰り返すコードの範囲を表します。
{ から } までのコードを指定回数繰り返します。

フォーの次のアイは定数です。
ここでは何回繰り返したかの数値が入っています。
このコードでは使いません。そのままにしてください。


5-2 4辺でループする 🔶

複数のコマンドをforループで繰り返します。

このページでは for がショートカットバー/ショートカットリストに並び、そこから選んで入力できます。

ここで for を選ぶと前のページの入力済みと同じコードが入力されます。
と同時に繰り返し回数を入力するための数値入力になります。

画像10

説明文に従い、入力済みのコードをforループの中に入れてください。

画像13


5-3 端まで行って戻る ⏺

パターンの繰り返しを見つける練習です。
このページは入力済みのコードがありません。
説明文とヒントを参考に、コードを入力してください。

ステージをじっくりながめまず方針を決め、繰り返しの1回分を完成させ実行して確認しましょう。

思ったようにできたら繰り返しのコードを追加して実行しましょう。
どんどん試しましょう。

ヒントには二つの方法があると書かれています。
余裕があればページをリセットして、もう一つの方法も試してください。


5-4 ワープしてループして ⏺

繰り返しパターンを見つける応用です。
このページも入力済みのコードはありません。

ステージは複雑で、二組の抜け穴があります。
課題をよく読み、ステージのパターンをじっくり探してください。

ヒントを参考にコードを入力して試してください。


5-5 3つの分かれ道 ⏺

コマンド、関数、forループを使う課題です。
このページも入力済みのコードはありません。
このページはパターンが見つけやすいと思います。

課題は『関数』も作り、それをループから利用することを求めています。


5-6 右にも左にも ⏺

繰り返しパターンを関数にしてforループで繰り返す練習です。
このページも入力済みのコードはありません。

練習のページが続きますが、この練習が大切です。
何もないまっさらな状態からコードを書く体験を積んでください。


5-7 4つの場所に4つの宝石 ⏺

パターンを見つけ出し関数とfor文で繰り返す応用課題です。

関数とループは重要です、この練習は無駄にはならないはずです。


5-8-1 指定回数繰り返す

範囲や値の集まり(配列)からひとつずつ値を取り出し終わりまで繰り返します。

for i in 1...4 {
   // 繰り返すコード iの値を使える
}

この例では定数 i が1から4まで繰り返します。
この例で i は定数の宣言は不要で、for の { から } の内側だけで使えます。

定数とか宣言とか説明なしに専門用語を使ってしまいました。
定数は値をしまっておくものです。
定数は名前と型を持ちます。(型も後ででてきます、文字とか数値とかの種類です)(ここでは名前が i アイ で整数型です)
宣言は「用語集」にも載っていますが、新しいものを作るためのコードです。


5-8-2 範囲

『...』は最後を含む範囲指定 
for i in 1...4 は 最初は1で 4を含む範囲を表します。
最初は1以外も指定できます。
最後は最初と等しいかまたはより大きな数値でなければなりません。

for i in 3...10 は正しいですが、for i in 3...1 とは書くことも実行することもできません。

最後を含まない指定もありますが最後を含む指定だけでもプログラミングできるのでここでは紹介しません。


 未経験者のための『コードを学ぼう』ガイド-3 へつづく

ここから先は

0字
このマガジンは著者への支援のためのものです。

未経験者のための『コードで学ぼう』ガイドシリーズをまとめて読めるマガジンです。★注意★現在このマガジンで読めるnoteはすべて無料で読める…

今後も記事を増やすつもりです。 サポートしていただけると大変はげみになります。