【JavaScript】配列を理解するためには

配列を使って心理テストのミニアプリを作成しました。

２年後には実際にプログラミングを授業の中で実施しなくてはなりません。授業案の７時間目。配列を使って心理テストアプリを作成します。

このぐらいシンプルな構造であれば、プログラミング初学者の生徒でも理解して進めることができます。

配列と言えばクイズ

私だけでしょうか。
配列を使ってプログラミングをするならクイズを作らせたくなります。
様々な方法がありますが、例えば三択クイズ。
問題と選択肢と答えを順に配列で並べて、選択肢がランダムに並ぶ。
問題と選択肢と答えを分けて書いてあげることもできます。
単純に順に表示させるだけなら、ハードルはそこまで高くないような感じです。

問題は回答方法

HTMLで複数ページ作れば済むようなことをJavaScriptでわざわざ書く必要はありません。
そこで、選択肢の位置が変わるようにしていきます。
すると、途端に難易度が上がります。
配列で並べたものを、randomで取り出してspliceで切り取っていく…
ちなみにボタンにはクリックイベント…
急にテクニックが増えます。
そうなると生徒の実態としては、半数くらいが思考停止して手先だけ動かし始めます。
これではoutです。

でも配列だけ理解しても面白くない

正直ここです。
なおかつ、配列は前に足したり削ったり、後ろに足したり削ったりと自由自在です。
プログラミングを学ぶということは、手順を分解する思考力を養うということだと思っています。
プリントに書いてあるプログラムを、上から順に正確に入力できることを問うているのではありません。
やっぱり動くものを作成する中で、思考力を養いたいものです。

配列で何作る？

私の勉強不足もあり、クイズとタイピングゲームぐらいしか思い浮かんでいません。
タイピングゲームは、以前作成しました。

【JaveScript】タイピングゲームの制作

ブラウザ上で動くタイピングゲームのミニアプリです。表示された文字列をタイピングすると、ランダムに次の単語が出てきます。プログラミング初級編としても、とっつきやすいように感じます。

これも結構な行数になっています。
よりシンプルな形に変更して実際に不在時の自習でやらせてみました。
残念ながら、思考停止で入力作業をしただけになっていたようです。
となると、配列で何作りましょうか。

まとめ

ここ一週間ほど、配列の授業案に悩んでしまっています。
プログラマー育成するわけではないのです。
繰り返しになりますが、プログラミングを学ぶということは、手順を分解する思考力を養うということだと思っています。
ただ、配列って、何かと組み合わせて始めて生きるんですよね。
まずは、基本の要素の取り出しを動かすから始めたらいいんですかねぇ。