【第4回】 【micro:bit講座 第4回】変数の応用:計算でりんごの数を変えてみよう!

MakeCode × micro:bit編

ポケットサイズのコンピューター「micro:bit(マイクロビット)」を使って、プログラミングの仕組みを楽しく分解して理解する本講座。第4回目となる今回は、前回学んだ「変数(へんすう)」をさらに使いこなし、データのやり取りを計算で表現する「変数計算」に挑戦します!

「変数はなんとなくわかったけど、どうやって使うの?」という疑問を、今回のレッスンでスッキリ解決していきましょう。

前回の宿題:答え合わせ

本題に入る前に、前回の宿題を覚えていますか?

「ぼくのりんご」を10個、「あにのりんご」を3個にして、ボタンを押すとそれぞれの数が表示されるチャレンジでしたね。

Aボタンで「ぼくのりんご」、Bボタンで「あにのりんご」を表示できればバッチリです!

本題に入る前に、前回の宿題を覚えていますか? 「ぼくのりんご」を10個、「あにのりんご」を3個にして、ボタンを押すとそれぞれの数が表示されるプログラムを作るというチャレンジでしたね。

Aボタンで「ぼくのりんご」、Bボタンで「あにのりんご」を表示できればバッチリです!

MakeCodeの編集画面:『最初だけ』ブロックで変数に数値を代入し、Aボタン・Bボタン・A+Bボタンそれぞれで、変数の値や変数同士の足し算の結果を表示するプログラムの完成例。
図1:AボタンとBボタンだけでなく、A+Bボタンを押したときに『計算ブロック』の中に『変数ブロック』を組み合わせて合計を表示できるようにしましょう。

ところで、宿題に取り組んでいるとき、「A+Bボタンを押したときには、何を表示させようかな?」と悩んだ人はいませんか? 「いもうとのりんご」を表示した人、あるいは「ぼく」と「あに」のりんごの数を合計して表示させた人など、きっと色々なアイデアが出たはずです。実は、その「合計を表示させる」という発想こそ、今回のレッスンで学ぶ「変数計算」の入り口なんですよ!

これまでのふり返り:プログラミングの「考え方」を積み上げよう

新しい内容に入る前に、私たちがこれまで冒険してきた道を少しだけふり返ってみましょう。

プログラミングは、魔法のような特別な技術ではありません。一つ一つの「考え方」を分解し、積み上げていくパズルのようなものです。今回学ぶ「変数の更新(計算による書き換え)」は、ゲーム制作やアプリ開発において、心臓部ともいえるほど重要なステップになります。

レッスンの準備:前回のプロジェクトを「複製」しよう

今回は前回の「プログラム3」の続きから作ります。しかし、元のプログラムを壊さないように、エンジニアがよく使う「複製(コピー)」というテクニックを使って準備をしましょう。

プロのエンジニアは、動いているプログラムをいきなり書き換えることはしません。必ずコピーをとってから作業をします。そうすれば、もし計算がおかしくなっても、元の動くプログラムにすぐ戻れるからです。これも大切な『デバッグ』の準備ですよ!

1. プロジェクトを複製する手順

1.MakeCode画面右上の「ホームボタン(家のマーク)」を押します。

MakeCode画面右上にある『家のアイコン』を赤い四角枠と矢印で強調している様子。
図2:まずは右上の『家のアイコン』を押して、プロジェクト一覧画面へ移動しましょう。

2.マイプロジェクトの横にある「すべて表示する」をクリックします。

『マイプロジェクト』の右横にある『すべて表示する』というリンクを赤い四角枠と矢印で強調している様子。
図3:マイプロジェクトの横にある『すべて表示する』を押すと、過去の作品がすべて確認できます。

3.前回作った「プログラム3」にチェックを入れ、「複製する」ボタンを押します。

リスト表示されたプロジェクト一覧で、『プログラム3』にチェックを入れ、上部の『複製する』ボタンを赤い四角枠と矢印で強調している様子。
図4:複製したいプロジェクトにチェックを入れて、上部の『複製する』ボタンを押せば準備完了です。

4.名前を「プログラム4」に変更して、複製ボタンを確定します。

これで、前回の続きから安全にスタートできますね!

ミッション1:新しい家族「妹」の登場とデータの追加

前回は「僕」と「兄」のりんごを管理しました。今回は、さらに「妹」を追加して、3人のデータを扱います。

1. 「いもうとのりんご」変数を作る

まずは、ツールボックスの「変数」から「変数を追加する…」をクリックし、「いもうとのりんご」という新しい魔法のバッグを作りましょう。

2. 初期値をセットする(最初だけ)

「最初だけ」ブロックの中に、以下の設定を追加します。

  • 変数「いもうとのりんご」を [0] にする

最初は妹はりんごを持っていない状態(0個)からスタートします。

エンジニアのヒント:初期化(しょきか)ってなに?
プログラミングでは、変数に最初に値を入れることを「初期化」と呼びます。今回の「0にする」という命令は、バッグの中に「0」というカードを入れて、準備万端にする大切な作業です。

3. ボタンで表示する

次に、妹のりんごの数を確認するボタンを作ります。 「入力」カテゴリーから「ボタン A+B が押されたとき」というイベントブロックを配置し、その中に「数を表示 [いもうとのりんご]」を入れます。

これで、エミュレーターのAボタンとBボタンを同時に押せば、いつでも妹の持ち数を確認できるようになりましたね!

ミッション2:りんごをあげる「やり取り」をプログラムする

ここからが今回のレッスンのハイライトです。 「僕が1個、兄が1個、それぞれ妹にりんごをあげた」という状況をプログラムで表現します。

1. 「あげる数」も変数にする

「1個あげる」という数字を直接書いても動きますが、将来的に「2個あげる」にすぐ変更できるように、「誰が何個あげるか」を管理するための新しいバッグを2つ作ります。

  • 変数「ぼくがあげるりんご」を [1] にする
  • 変数「あにがあげるりんご」を [1] にする

これらを「最初だけ」ブロックに追加しましょう。

2. 妹のりんごを計算で増やす

いよいよメインイベントです。「A+Bボタンが押されたとき」の処理を改造しましょう。 合計を計算して、妹のバッグを最新の状態に更新します。

ブロックの組み立て方:

  • 「変数」カテゴリーから「変数『いもうとのりんご』を [0] にする」というブロックを配置します。
  • その [0] の部分に、「計算」カテゴリーの「足し算ブロック」を入れ子にしてはめ込みます。
  • さらにその足し算の中に、もう一つ足し算を入れ子にして、3つの数字を足せるようにします。
  • 最終的に いもうとのりんご(0) + ぼくがあげるりんご(1) + あにがあげるりんご(1) となるように配置しましょう。

これで、A+Bボタンを押すたびに妹のりんごが増えていく準備が整いました!

【エンジニアの視点】何かがおかしい?「バグ」を見つけよう

シミュレーターでA+Bボタンを押して、妹が2個持っていることを確認したあと、Aボタン(僕の数)とBボタン(兄の数)を押してみてください。

  • ぼくのりんご: 4個のまま
  • あにのりんご: 6個のまま

……あれ? 妹にあげたはずなのに、僕たちのりんごが減っていません! これこそが、プログラミングでよく起こる「論理的な間違い」、通称バグ(Bug)です。コンピューターは言われたことしかやりません。「妹の数を増やせ」とは言われましたが、「僕たちの数を減らせ」とはまだ命令されていないのです。

ミッション3:変数を「更新」して数を減らそう

本当の「やり取り」を完成させるために、あげた人のバッグからりんごを取り出す(=変数の値を書き換える)プログラムを追加しましょう。

1.「自分から引く」という考え方

「ぼくのりんご」を減らすには、今の数から「あげる数」を引いた結果で、バッグの中身を入れ替える必要があります。

ブロックの組み立て方:

  1. 「変数」カテゴリーから「変数『ぼくのりんご』を [0] にする」を配置します。
  2. その [0] の部分に、「計算」カテゴリーの「引き算ブロック」をはめ込みます。
  3. 引き算の左側に「ぼくのりんご」変数、右側に「ぼくがあげるりんご」変数をはめ込みます。
  4. このブロックを、「A+Bが押されたとき」の処理の中(妹の計算の後)に追加しましょう。

2.バグ退治の結果を確認しよう!

プログラムを書き換えたら、もう一度シミュレーターで確認です。

  • A+Bボタンを押して、妹の数を確認
  • その後、Aボタンを押すと……「3」になった!
  • Bボタンを押すと……「5」になった!

「自分たちが持っていた数が減る」という、現実世界と同じ変化がコンピューターの中で再現されましたね!

エンジニアのヒント:これが「バグ修正(デバッグ)」です!
エンジニアの仕事はコードを書くことだけではありません。実は、書いたプログラムが「思った通りに動いているか?」をチェックし、おかしな動き(バグ)があれば直す「デバッグ」こそが、仕事の時間の半分以上を占めることもあるんですよ。今日、あなたは一人前のデバッグ作業を成し遂げました!

MakeCodeの編集画面:『最初だけ』ブロックで5つの変数を初期化し、『A+Bボタンが押されたとき』のブロックで、妹のりんごを合計して増やし、同時に僕と兄のりんごを減らすという『変数の更新』処理が完成している様子。
図5:第4回の最終完成形です。妹の数が増え、僕と兄の数が減る……という『やり取り』がプログラムで完璧に再現されました。エンジニアの仕事である『デバッグ(バグ修正)』もこれで完了です!

図5の『A+Bボタンが押されたとき』のブロックに注目してください。妹の数を増やす計算のすぐ下に、自分たちの数を減らす計算を並べることで、りんごが『移動した』ように見える仕組みを作っています。これがプログラミングにおけるデータの管理術です!

今日のまとめ:変数と計算のコンビネーション

今回のレッスンでは、以下の重要なポイントを学びました。

  1. 変数の複製: 前のプログラムを活かしつつ新しく作る効率的な方法。
  2. 複雑な足し算: 3つ以上の変数を足し合わせる「入れ子」の使い方。
  3. 整合性(せいごうせい): 「増える」プログラムがあれば「減る」プログラムも書かないと、現実に合わなくなるということ。
  4. 変数の更新: 今の自分 = 今の自分 ー 引く数 という、プログラミング特有の計算ルール。

こうした「数値を管理して、正しく書き換えていく」技術は、銀行のシステムからゲームのダメージ計算まで、あらゆる場所で使われています。

【宿題】自分専用の「お小遣い帳」を作ってみよう

今日のレッスンで、あなたは「変数を増やしたり減らしたりする」という魔法を手に入れました!

宿題ミッション:

自分のお小遣いを「おこづかい」という変数で管理し、Aボタンで「100円もらう(加算)」、Bボタンで「50円使う(減算)」、A+Bボタンで「いま、いくら残っているか」を表示するプログラムに挑戦してみてください。

これができれば、あなたのmicro:bitは立派な「家計簿コンピューター」に進化しますよ!

考えてみてほしいこと:バグ(Bug)の発見!

このプログラムで、Bボタンをたくさん押して、おこづかいをどんどん減らしてみてください。 ……あれ?

「マイナス」の金額になっていませんか?

現実の世界では、おこづかいがマイナスになることはありませんよね。 実は、これこそが「バグ」です。コンピューターは言われた通りに計算するだけなので、「0円以下になったらどうするか」まで教えないと、平気でマイナスの計算をしてしまうのです。

このバグを解決するには、どうすればいいでしょうか?

この判断を下すための強力な魔法の伝授はしばらく先になりそうです。

それまでの間、ぜひ自分なりに「どうすればコンピューターに『マイナスはダメだよ』と教えることができるか?」を想像してみてください。そのモヤモヤした疑問こそが、次のステップへ進むための最高の燃料になります。

次回の予告

次回の第5回テーマは「【第5回】 【micro:bit講座 第5回】変数の実践:もっと便利に!変数で計算を自動化しよう!(7/1 10時公開予定!)」です。

次回は、ついにお父さんとお母さんも登場し、家族全員のりんごを管理します。人数が増えると計算はもっと複雑に、そしてもっと楽しくなります。

家族全員の合計を一瞬で出すにはどうすればいいのか? さらに進化した変数の使い方を一緒に学んでいきましょう。

今日のレッスンが役に立った、面白かったという方は、ぜひコメントをお願いします!あなたの応援が、次のエネルギーになります。

それでは、また次のレッスンでお会いしましょう。ありがとうございました!

コメント