1.プログラム — コンピューターに渡す正確な指示書
プログラムとは、コンピューターがすべきことを順番に書いた指示書です。料理のレシピに似ていますが、大きな違いが一つあります。人はレシピに「塩少々」と書いてあっても自分で見当をつけますが、コンピューターは見当をつけません。書かれたとおりに、書かれた順番どおりにしか動きません。ですから、プログラムを書くということは、「うまくやってくれるだろう」という部分を一つも残さず、すべて言葉にして書くことです。
この「見当をつけない」性質は短所でもあり長所でもあります。指示が少しでも間違っていればとんでもない結果になりますが、指示が正しければ、百回でも百万回でも同じように、疲れることなく、速くやり遂げます。毎月Excelの表で同じ列を合計する、ファイル名を一つずつ変える、数百行のテキストで電話番号の書式をそろえるといった、人がやると退屈でミスしやすい作業こそ、プログラムの得意分野です。
最近は、AIのコーディングアシスタントに言葉で頼めばコードを代わりに書いてくれることもあります。だからといって、コーディングの基礎が要らなくなったわけではありません。AIが書いたコードが本当に望んだとおりに動くのか、見落としているケースはないのかを判断するには、コードを読めなければなりません。このコースの目標はプロの開発者になることではなく、かんたんなコードを自分で書き、他の人(またはAI)が書いたコードを読んで確かめられるようになることです(第10講)。
2.アルゴリズム的な考え方 — 順番・条件・繰り返しに分ける
ある問題を解くための手順のまとまりを、アルゴリズムといいます。名前はおおげさですが、私たちは毎日アルゴリズムを使っています。朝家を出るまでの流れ、買い物の順番、テストの採点のしかたは、どれもアルゴリズムです。プログラミングを学ぶことは、こうして頭の中で自然にやっていたことを、一つずつ取り出して書き出す練習でもあります。
驚くことに、ほとんどすべてのアルゴリズムは三つの材料でできています。一つ目は順番で、上から下へ順に行うことです。二つ目は条件で、「もし〜ならこうする、そうでなければああする」のように状況によって分かれることです(第3講)。三つ目は繰り返しで、同じことを決まった回数だけ、またはある条件になるまで繰り返すことです(第4講)。この三つを自由に組み合わせられれば、たいていの仕事は指示書に置き換えられます。
分けるときのコツは、「この手順を初めて見る人がそのとおりにできるか」と問うことです。「テストを採点する」では大きすぎます。「一つ目の答えを正解と比べる、同じなら点数に1を足す、次の答えに進む、最後の答えまで繰り返す」のように分けると、ようやく順番・条件・繰り返しが見えてきます。こうして見えてきた構造が、そのままコードの骨組みになります。
| 材料 | 意味 | 暮らしの中の例 | 学ぶ講義 |
|---|---|---|---|
| 順番 | 上から下へ順に行う | お湯を沸かす → 麺を入れる → 3分待つ | 第1講 |
| 条件 | 状況によって違うことをする | 雨が降っていれば傘を持ち、そうでなければそのまま出かける | 第3講 |
| 繰り返し | 同じことを何度も繰り返す | 答案の最後まで一問ずつ採点する | 第4講 |
- ステップ1 準備(順番):欠席数を0とし、名簿の一人目の生徒から始めます。
- ステップ2 確認(条件):今の生徒が席にいなければ、欠席数に1を足します。いれば何もしません。
- ステップ3 次へ進む(繰り返し):次の生徒に進んでステップ2を繰り返します。名簿の最後の生徒まで確認したら止まります。
- ステップ4 結果(順番):欠席数を知らせます。
- 検算:30人全員が出席なら欠席数は最初に決めた0のままで、全員が欠席なら30になります。両端のケースが合っていれば、分けた手順も信頼できます。
3.入力 → 処理 → 出力
アルゴリズムを外から見ると、いつも同じ形をしています。何かを受け取り(入力)、それを使って何かをし(処理)、結果を出します(出力)。電卓は数字と演算を受け取って計算し、画面に答えを表示します。スペルチェッカーは文章を受け取って誤りを見つけ、印を付けてくれます。初めてコードを書くときは、この三つの欄を先に埋めておくと、何を作ればよいかがずっとはっきりします。
特に大切なのは、入力をはっきりさせることです。「価格を計算する」とだけ言うと、何を受け取るのかが抜けています。「商品の価格と個数を受け取って合計を出す」と言えば、入力が二つであること、どちらも数であることがわかります。すると、「個数が0なら?」「価格がマイナスで入ってきたら?」といった問いが自然に続きます。こうした問いを前もって投げかける習慣が、第3講の境界値、第10講のAIコードの検証につながります。
このコースの練習場では、処理の結果をおもにconsole.logで出力します。第5講で関数を学ぶと、入力を「引数」で受け取り、出力を「戻り値」で返すやり方に移ります。形は変わっても、入力・処理・出力という枠組みはそのままです。
| 作業 | 入力 | 処理 | 出力 |
|---|---|---|---|
| 買い物の合計 | 商品の価格 | すべて足す | 合計金額 |
| 平均点 | 点数の一覧 | 足してから個数で割る | 平均 |
| 文字数を数える | 文章 | 文字を一つずつ数える | 文字数 |
| 合否 | 点数 | 合格点と比べる | 合格または不合格 |
4.最初のコード — JavaScriptと`console.log`
このコースはJavaScriptで学びます。JavaScriptはどのWebブラウザにも実行環境が入っているので、何もインストールしなくてもすぐに動かせます。Webページを動かす言語として始まりましたが、今ではサーバー、自動化スクリプト、表計算ソフトの拡張機能などでも広く使われています。ここで学ぶ順番・条件・繰り返し・関数といった考え方は、他の言語に移ってもほぼそのまま通用します。
最初に覚える命令はconsole.logです。かっこの中に入れた値を、出力欄に1行で表示します。文字(文字列)はダブルクォートかシングルクォートで囲み、数はそのまま書きます。カンマで区切って複数の値を入れると、1行の中に空白をはさんで続けて表示します。計算式を入れると、計算した結果が出ます。
コードは上から下へ1行ずつ実行されます。ですからconsole.logを3行書けば、出力も3行が同じ順番で出てきます。これが、アルゴリズムの最初の材料である「順番」がコードに現れるいちばん単純な姿です。下のコードを練習場にそのまま書き写して実行し、数や文字を変えながら出力がどう変わるかを確かめてみましょう。
console.log("こんにちは");
console.log("コーディングの基礎コースです");
console.log(2026);こんにちは コーディングの基礎コースです 2026
console.log("りんご3個の値段:", 1200 * 3);
console.log("10 割る 4 =", 10 / 4);
console.log("名前", "ゆうき", "年齢", 20);りんご3個の値段: 3600 10 割る 4 = 2.5 名前 ゆうき 年齢 20
console.logで値を追いかけるところから始まります。5.文・コメント、そして最初のエラーを読む
コードの1行1行を文と呼び、JavaScriptでは文の終わりにセミコロン(;)を付けるのが慣例です。付け忘れてもたいていはうまく処理されますが、まれに意図と違う解釈をされることがあるので、このコースではいつも付けます。//の後ろに書いた文字はコメントで、実行されません。コメントは人が読むために残すメモで、「なぜこうしたのか」を書いておくと、あとで自分や同僚(そしてAI)がコードを理解するのに大いに役立ちます。
コンピューターは見当をつけないので、1文字間違えただけでも止まります。たとえばconsoleをconsolと書き間違えると、「そんな名前は定義されていない」というエラーになります。最初は赤いエラーメッセージが怖く感じられますが、エラーは、コンピューターがどこで何のために止まったのかを教えてくれる親切な案内です。メッセージにはふつう、エラーの種類、短い説明、行番号が含まれています。
下の例では、1行目は正常に出力され、2行目で止まります。エラーが起きた後の行は実行されないことにも注目してください。エラーメッセージの文言はブラウザによって少しずつ違うことがありますが、エラーの種類(ここではReferenceError)と行番号は同じ情報を伝えてくれます。エラーの種類ごとの読み方は第8講で詳しく扱います。
// コメントは実行されません
console.log("1行目"); // 行の終わりにも書けます
console.log("2行目");1行目 2行目
console.log("ここまでは実行されます");
consol.log("打ち間違いのある行");
console.log("この行は実行されません");ここまでは実行されます
ReferenceError: consol is not defined- エラーメッセージを最後まで読む:種類(
ReferenceErrorなど)→ 説明 → 行番号の順に見る - 行番号が指す行と、そのすぐ上の行をあわせて見る:かっこや引用符の付け忘れは前の行から始まっていることもある
- 一度に一か所だけ直して、もう一度実行する:何か所もまとめて直すと、何が効いたのかわからない
- つづりと大文字・小文字を確かめる:JavaScriptは
Consoleとconsoleを別の名前として扱う
6.練習場の使い方
講義ごとに、いちばん下にコードの練習場があります。最初のコードにはやることがコメントで書かれていて、空欄を埋めて実行すると出力が表示され、採点を押すと期待した結果と比べてくれます。行き詰まったらまずヒントを見て、それでも難しければ解答例を見ましょう。ただし、そのまま写すのではなく、なぜそう書いたのかを1行ずつ確かめてから消し、自分でもう一度書いてみるのが、いちばん早く上達する方法です。
練習場のコードはみなさんのブラウザの中だけで、他のページから切り離された安全な空間(サンドボックス)で実行され、サーバーには送られません。そのため、console.logで出力する以外の、画面を書き換えたりインターネットに接続したりするコードは、練習場では動きません。うっかり終わらない繰り返しを作ってしまっても数秒で自動的に止まるので、思う存分試してかまいません。
練習場で何でも変えてみることを怖がらないでください。数を変え、行の順番を変え、わざと打ち間違えてみれば、エラーメッセージがどう変わるかがわかります。コーディングは読むだけでは上達しません。自分で実行して、間違えてみることで上達します。
📌 要点まとめ
- プログラムは、コンピューターが見当をつけずにそのまま従う正確な指示書である
- ほとんどすべてのアルゴリズムは、順番・条件・繰り返しの三つの材料の組み合わせである
- 仕事を分けるときは、初めて見る人がそのとおりにできるほど小さく分ける
- どんな作業も入力・処理・出力に分けてみると、作るものがはっきりする
console.logで値を出力し、エラーメッセージは種類・説明・行番号の順に読む
🧪 コード実習
console.logだけを使って出力を合わせる練習です。出力は1行ずつ、期待する出力と比べます。
コードはこのブラウザの中の隔離された場所でだけ実行され、サーバーには送られません。ネットワークには接続できず、2秒を超えると止まります。書き換えたコードはこのブラウザにだけ保存されます。Ctrl+Enter(⌘+Enter)で実行、Tabキーは空白2つ(Escの後のTabで次へ移動)。
JavaScriptが無効なので実行はできませんが、問題・最初のコード・自動チェックの内容・解答例はそのまま読めます。
13行を出力する
console.logを3回使って、次の3行を順番に出力してください:こんにちは / コーディングの基礎 第1講 / 準備完了
こんにちは コーディングの基礎 第1講 準備完了
💡 ヒント
文字はダブルクォートで囲み、行の終わりにセミコロンを付けます。1行にconsole.log一つずつです。
解答例を見る
console.log("こんにちは");
console.log("コーディングの基礎 第1講");
console.log("準備完了");
2入力 → 処理 → 出力:レシート
仮の買い物です。牛乳を2,500ウォンで2本、パンを3,000ウォンで1個買いました。計算はコードに任せて、次のように3行を出力してください:牛乳: 5000 / パン: 3000 / 合計: 8000。数を直接書かずに、2500 * 2のように計算式を使ってください。
牛乳: 5000 パン: 3000 合計: 8000
💡 ヒント
カンマでつないだ二つの値は、空白一つでつながります。掛け算は*で、掛け算は足し算より先に計算されます。
解答例を見る
// 牛乳 2500ウォン x 2本、パン 3000ウォン x 1個
console.log("牛乳:", 2500 * 2);
console.log("パン:", 3000 * 1);
console.log("合計:", 2500 * 2 + 3000 * 1);
3順番を正す
インスタントラーメンを作る手順がばらばらになっています。行の順番だけを入れ替えて、ステップ1からステップ5まで順に出力されるようにしてください。文字は直さないでください。
1. 鍋に水を入れる 2. お湯を沸かす 3. 麺とスープの素を入れる 4. 3分待つ 5. 器に盛る
💡 ヒント
コードは上から下へ実行されます。先にやるべきことが上に来るように、行を移しましょう。
解答例を見る
console.log("1. 鍋に水を入れる");
console.log("2. お湯を沸かす");
console.log("3. 麺とスープの素を入れる");
console.log("4. 3分待つ");
console.log("5. 器に盛る");
🤖 AIにはこう聞いてみましょう
コピーして [ ] の部分を自分の状況に書き換えて使います。答えはそのまま信じず、本文と比べて確かめましょう。
日々の作業をアルゴリズムに分けてみたいとき
私が毎週している[作業の説明]を、初めて見る人がそのとおりにできるように手順に分けてください。それぞれの手順が順番・条件・繰り返しのどれにあたるかを示し、入力と出力を別に書いてください。まだコードは書かずに、私が見落としているケース(たとえばデータが空のとき)があれば質問してください。
初めてエラーメッセージに出会ったとき
私はJavaScriptを学び始めたばかりです。下のエラーメッセージを種類・意味・行番号に分けてやさしく説明してください。直したコードをすぐに渡すのではなく、自分で見つけられるように、まず確認すべき場所を教えてください。コード:[コードを貼り付け] エラー:[エラーメッセージを貼り付け]
練習問題がもっと欲しいとき
JavaScriptの`console.log`だけで解ける、とてもやさしい練習問題を5つ作ってください。問題ごとに期待する出力を正確に書き、正解のコードは伏せておいて、私が答えを送ったら1行ずつ比べて教えてください。
🧰 関連ツール
この講義で扱ったJSON・正規表現・テキストを、その場で確かめたり整えたりできるツールです。本物の個人情報やパスワードは貼り付けないでください。
- MDN Web Docs — JavaScriptガイドの文法とデータ型・console のドキュメント
- プログラミング入門の教材で扱われる、アルゴリズム(順次・選択・反復)と入力・処理・出力モデルの一般的な内容
学習目標をすべて達成できたら完了を押しましょう。
このブラウザでは保存できないため、この画面でのみ表示されます。