JavaScript版APS

このページでは、JavaScriptを用いてプログラミングを学ぶためのAPSを紹介します。

授業でPythonを用いる場合、下記のリンク先のページをご覧ください。

単元「プログラミング」のAPS(Python/Brython版)一覧

最初に取り組むAPSとしては、「おみくじ(JavaScript版)」を推奨します。次のおすすめは「ソーメンタイマー(JavaScript版)」です。

APSのタイトル プログラムの内容・学習項目 難易度 所要時数
おみくじ(JavaScript版) 「おみくじ」を実現するアプリケーション。

乱数と条件分岐を学ぶ。

  • 組み込み関数Math.random()を用いて、乱数を生成する
  • 生成された乱数の値に応じて、結果を変える(大吉、中吉…)。if…else if…else文を説明する
  • 生成する乱数の範囲を変えて、おみくじの結果を変更する
  • 乱数の値に応じて変える処理に、メッセージ表示処理を追加する
3
ソーメンタイマー(JavaScript版) ダウンタイマーを実現するアプリケーション。

JavaScriptのタイマー機能と、条件分岐を学ぶ。

  • JavaScriptの「1秒経過したら指定した処理を実行する」という仕組みと、「処理を実行する毎に、変数の値を1ずつ減らし、0になったら終了」という条件分岐構造を使い、カウントダウンタイマーを実現する仕組みを理解する
  • 条件分岐の仕組みを用いて、キリのいい経過時間が経過したタイミングで処理を行わせる
  • HTML,CSSを変更して、アプリケーションの見かけを変更する
★★ 2
複利計算(JavaScript 複利が加わる積立の計算を行い、グラフと表で結果を表示するアプリケーション。

繰り返し制御で複利計算を行い、結果を配列に格納する。配列の中のデータを表とグラフで表示する方法を学ぶ。

  • 積立額、利率を入力して実行し、グラフと表で結果を確認して、複利の概念を学ぶ
  • 年ごとの計算結果を、要素に格納し、結果を利用する様子を確認して、配列の概念と操作方法を学ぶ
  • 積立年数や積立の目標値を入力できるようにするカスタマイズを通じて、HTMLとJavaScriptの連携方法を学ぶ
★★★ 3

 

以下のAPSは、作品制作に利用しにくい内容のため、参考として紹介します。

APSのタイトル プログラムの内容・学習項目 難易度 所要時数
APS RDB蔵書管理(JavaScript版) 書籍のデータを管理するために、リレーショナルデータベースを組み込んだアプリケーション。

  • データベースに対して、アプリケーションの画面から、検索・登録などの操作を行う
  • アプリケーションとER図から、リレーショナルデータベースの表の概念を学ぶ
  • SQL文を書いて、データベースのデータを操作する
★★★ 3
APS地図アプリ(JavaScript版) 地図上にマーカーや説明を表示するアプリケーション。

  • オープンデータであるオープンストリートマップと、国土地理院が公開している地理院地図を使って、複数種類の地図データがあることを学ぶ
  • 緯度・経度を指定して、地図データにピンを表示する方法を学ぶ
★★ 2
APSデータロガー(JavaScript版) クラウドデータベースに、GPSデータ(緯度経度)を定期的に保存するアプリケーション。

  • クラウド上のAPIを利用するために必要な情報「APIキー」の概念を学ぶ
  • クラウド上のAPIを利用するプログラムを学ぶ
  • 端末のセンサー情報を利用するプログラミングの技法を学ぶ
★★ 2
APS手書き文字認識(JavaScript版) 手書きで入力した文字をAIに認識・判定させるアプリケーション。機械学習モデルの生成も行う。

  • AIを用いたアプリケーションを実際に操作してみる。手書き文字をAIが正しく認識するかどうか確かめ、その精度や限界を考える。
  • AIにデータを渡して、学習モデルを作る。作成したモデルで、手書き文字を認識するかどうか確かめる。
★★★ 2