雑誌名 久留米大学コンピュータジャーナル
巻 29
ページ 41‑51
発行年 2015‑03‑01
URL http://hdl.handle.net/11316/522
- 41 -
1. はじめに はじめに はじめに はじめに
だいぶ前から学生の就職活動やキャリア教育に関する書籍がやたらと目につくようになった。数年前，
そんな中の
1
冊を読んでいて，気になる一文があった。概略は「一流企業の内定者に一流大学の学生が 多いのはなぜか。一般論として，一流大学の学生は高校時代にしっかり勉強したものであり，かれらは 大学でもよく学び，就職活動でも十分な準備の上で取り組む傾向がある。したがって，二流大学の学生 が一流企業にチャレンジするのであれば，かれら以上の努力が求められるにもかかわらず，云々」とい うものである。一流，二流という表現はいささか気に障るものの，反論はしにくい。何年か前，秋になっても就職が決まらないゼミ生に「どこらあたりで落とされるのか」を聞いたとこ ろ，「SPI」という返事であった。もちろん，だれもがそうだとは思わないが，これまで何度か実施した 非言語系
SPI
講習会の経験から言えば，参加した学生のSPI
実力は決して十分ではなく，しかも回数を 重ねるごとに出席者は急速に減っていった。「かれら以上の努力が求められる」の一文が頭をよぎる一瞬 である。この分野は，作文とか質疑応答などよりよほど勉強の成果が出やすいだけに，なおさら残念な 思いを免れない。そんな中で取り組んできたのが，ここで紹介する
SPI
学習システムである。世の中，すでにe-Learning
の時代であり，いまさらかもしれない。そうなのだが，いつでも誰にでも同じ問題が提示されるシステ ムは好きになれない。かつて，某企業が提供している初級シスアド（現在のIT
パスポート試験）対策のe-Learning
システムを3
か月間一人当たり3000
円という契約で学生に利用させたことがあった。その顛末は，ほとんどの学生がわずか数時間で全問題を解き終え，「先生，これ役に立ちません」であった。
ここで紹介するのは，少なくとも問題の数字は常に変わり，何度でも学習が可能なシステムである。
現在，授業中の小テストや宿題もすべてこの形式で実施している。単純な手法であり，何かの参考にな れば幸いである。
2. メインページ メインページ メインページ メインページ
大それたものではない。「もっとも簡便」（なにしろメモ帳しか要らない）という，私にとってもっと も大事な理由で，HTMLドキュメントの中に
JavaScript
のプログラムを埋め込んだだけのシステムであ る。メインの画面は図
1
のようになっており，左のフレームで問題を選択すると右ページに問題が表示さ れる。答えを入力して正解であれば「正解です」と表示され，同時に左側の問題選択ボタンの右に点数原田 康平†
Kouhei Harada
††久留米大学 経済学部
†Faculty of Economics, Kurume University.
Web を利用した を利用した を利用した を利用した SPI 学習システムの試作 学習システムの試作 学習システムの試作 学習システムの試作
The sample system for SPI learning on the Internet.
42
「1」が表示される。
図 図 図
図
1
メインメニュー画面メインメニュー画面メインメニュー画面メインメニュー画面「問題を更新する」をクリックすると，形式は同じだが数字が異なる問題が表示され，正解であれば 左画面の点数が「2」に増やされる。右画面にある「ok」ボタンは「この問題は回答済み」を示すフラグ である。
全体の
HTML
ドキュメントは技も何もない簡明な内容である。“index.html”
<html>
<frameset cols="25%,75%">
<frame src="main.html" name="pleft">
<frame src="start.html" name="pright">
</frameset>
</html>
左の
main.html
は次の通り。“main.html”
<html>
<body>
次の問題から選んでください。<br>
なお，全体をリロードすると，記録されている点数はリセットされます。<br><br>
<form name="menu">
<a href="turu1.html" target="pright">鶴亀算
１</a><input type="button"name="b_turu1"><br>
<a href="turu2.html" target="pright">鶴亀算
２</a><input type="button"name="b_turu2"><br>
（中略）
- 43 - </body>
</html>
3. ランダムな整数を作る関数 ランダムな整数を作る関数 ランダムな整数を作る関数 ランダムな整数を作る関数 ransu
「数字をランダムに変える」関数は関数
random()で簡単に作ることができる。
function ransu(xmin,xmax) {
return Math.floor(Math.random()*(xmax-xmin+1)+xmin);
}
たとえば「
100
から300
の範囲の10
刻みの整数」が欲しければ，ransu(10,30)*10
でよい。しかし，「10.0 から30.0
に範囲で0.1
刻み」で単純にransu(100,300)/10
とすると，ときどき15.79999999999998
などと出 てくる。2
進数は小数点以下の10
進数の多くを正確に表せないことと関わっていると思うのだが，いま だによく分からない。たとえば0.000000001
を足して文字列に変換，上位5
桁ほどを切り取り，数字に 変換などということもやってみたが，そもそもその数字を正確に表せないのだから，数字に変換した時 点でアウトである。「ときどき」が嫌味で，いまのところは放置している。「試作」が取れない所以であ る。4. 鶴亀算 鶴亀算 鶴亀算 鶴亀算
鶴亀算の
HTML
ドキュメントは次の通り。HTML
の基本タグとJavascript
の初歩だけで十分な内容で ある（そうでなければ，講義の合間に問題を作りためることがむつかしくなる）。“turu1.html”
<html>
<head>
<script language="Javascript">
function ransu(xmin,xmax) {
return Math.floor(Math.random()*(xmax-xmin+1)+xmin);
}
function check() {
if(document.myForm.kaito.value==na)
{ document.myForm.hantei.value="正解です";
if(document.myForm.kekka.value!="ok")
parent.pleft.document.menu.b_turu1.value++;
document.myForm.kekka.value="ok";
} else
document.myForm.hantei.value="不正解です";
}
function koshin() {
44 location.reload();
} </script>
</head>
<body>
<form name="myForm">
<script language="Javascript">
ta=ransu(5,29)*10;
tb=ta+ransu(5,19)*10;
na=ransu(15,30);
nb=na+ransu(5,20);
nt=na+nb;
tt=ta*na+tb*nb;
document.write("単価 "+ta+"円の商品 A
と単価"+tb+"円の商品 B
を合計"+nt+"個買ったところ，合計金額が "+tt+"円になった。商品 A
の購入個数はいくらか。<br>");
</script>
<br>
答＝<input type="text" name="kaito">
<input type="button" onClick="check()" value="チェック ">
<input type="text" name="hantei"><input type="button" name="kekka">
<br><br>
<a href="turu1_hint.html" target="_blank">ヒント</a>
<br><br><input type="button" onClick="koshin()" value="
問題を更新する"><br>
</form>
</body>
</html>
2
つの商品A，B
に関する鶴亀算では，それぞれの単価ta，tb
と個数na，nb
を決めると，合計の個数nt
と合計金額tt
が決まる（先にnt
とtt
を決めると，na，nbが整数にならないことが多くなる）。その上 で，ta，tb，nt，ttを表示し，naを求めさせる。ここでは各値を次のように決めている。ta=ransu(5,29)*10; 50
から290
の範囲で10
刻みtb=ta+ransu(5,19)*10; ta
に50
から190
の範囲の10
刻みの整数を加算した値na=ransu(15,30); 15
から30
の範囲の整数nb=na+ransu(5,20); na
に5
から20
の範囲の整数を加算した値蛇足だが，「
ok」フラグや左の点数をボタンに表示させているのは，ユーザー自身による書き直しを予
防するためである。ヒントは次のようになっている。
- 45 -
図図図図
2
鶴亀算のヒント画面鶴亀算のヒント画面鶴亀算のヒント画面鶴亀算のヒント画面鶴亀算
2
の問題は次のようになっている。図 図 図
図
3
鶴亀算鶴亀算鶴亀算鶴亀算2
の表示例の表示例の表示例の表示例5. 年齢算 年齢算 年齢算 年齢算
年齢算は次のような問題である。
図 図 図
図
4
年齢算の表示例年齢算の表示例年齢算の表示例年齢算の表示例この問題は，「父は子どもの
n
倍」としたとき，父と子の年齢差がn－1
の整数倍でないと答えが整数46
にならないことに注意が必要である。また，うまく整数を選んだとしても，たとえば父親の年齢が
14
歳とか85
歳では不自然さを免れない。そこで，次のような手順で数字を決めていく。1）
父親と子どもの年齢差yd
を24
から32
の範囲で決める ･･･ ransu(24,32)2）
「ny年後にnb
倍になる」のnb
を2～5
の範囲の整数で決める･･･ ransu(2,5)3）
年齢差÷(nb－1)の商＋1
をny
年後の子どもの年齢yc1
とする･･･ Math.floor(yd/(nb－1))＋1
4）ny
年後の父親の年齢yf1
を決める･･･ nb*yc15
）ny
をny
年後の子どもの年齢yc1
の20
～80
％の整数で決める･･･ Math.floor(yc1*ransu(20,80)/100)
6）いまの子どもの年齢 yc
が決まる ･･･ yc=yc1－ny7）いまの父親の年齢 yf
が決まる ･･･ yf=yc1*nb－nyしたがって，問題を表示する部分は次のようになる。
<script language="Javascript">
yf=ransu(31,38);
yc=ransu(3,7);
nb=ransu(2,4);
nb1=nb-1;
yc_post=Math.floor((yf-yc)/nb1);
yf_post=yc_post*nb;
ny=yc_post-yc;
yf=yf_post-ny;
document.write("父親の年齢が "+yf+"歳，子どもの年齢が "+yc+"歳のとき，<br>");
document.write("父親の年齢が子どもの年齢の "+nb+"倍となるのは何年後か。<br>");
</script>
ヒントは次の通り。
［SPI流］
年齢算の特徴は，次の点にある。
○親の年齢と子どもの年齢の差はいつも変わらない。
○親の年齢が，子どもの年齢の
n
倍のとき，年齢差はn－1
倍である。「子ども
5
歳，親30
歳」→ 親は子どもの6
倍，年齢差25
は5
倍「子ども
10
歳，親40
歳」→ 親は子どもの4
倍，年齢差30
は3
倍- 47 -
したがって，次のように計算する。ここで，倍数をｎとしている。
1）年齢差を求める
2）年齢差を n－1
で割る（親が子どものn
倍になったときの子どもの年齢）3）2）で求めた年齢といまの子どもの年齢の差が答え
例）親が
35
歳，子どもが5
歳とする。親が子どもの3
倍になるのは何年後か。1）年齢差は 35－5＝30
2
）n
－1
は3
－1
＝2
だから，30
÷2
＝15 3）いま 5
歳なら，15－10＝10
年後が答え。［方程式」
親の年齢を
A，子どもの年齢を B，倍数を n，答えを x
年後とするなら，(A＋x)＝n(B＋x)
→ A-nB＝(n－1)x → x＝(A－nB)/(n－1)図 図 図
図
5
年齢算年齢算年齢算年齢算1
のヒントのヒントのヒントのヒント年齢算
2
は次のような問題となっている。図図
図図
6
年齢算年齢算年齢算年齢算2
の表示例の表示例の表示例の表示例この問題のヒントだけ示しておきたい。方程式を立てるのは意外と面倒で，解くのにちょっと時間もか かる。
SPI
流の解き方を学習しておく必要性を痛感させる典型的な問題と思う。［SPI流］
親子の年齢合計が出てくる年齢算の特徴は，次の点にある。
○親子の年齢合計は１年に２歳ずつ増える。
○親の年齢が子どもの年齢のｎ倍のとき，年齢の合計は子どものｎ＋
1
倍である。親が子どもの
5
倍なら，親＋子どもは，子どもの6
倍になるしたがって，次のように計算する。ここで，「yr年前に
n
倍」としている。1）いまの年齢合計から yr
の2
倍を引く（これがyr
年前の年齢合計）2）1）の値を n＋1
で割る （これが子どもの年齢である）3）2）で求めた年齢に yr
を加えると，これがいまの子どもの年齢で答え例）いまの合計が
72
歳で，16年前に母親は子どもの7
倍であった。48 1）16
年前の年齢合計は72－16×2＝40
2
）母親が子どもの7
倍なら，合計は子どもの8
倍で，40
を8
で割ると，このときの子どもは5
歳3） 16
年後は5＋16＝21
歳。［方程式」
いまの子どもの年齢を
x，親の年齢を y，合計を g，yr
年前に親は子どものn
倍とするなら，x＋y＝g
y－yr＝n(x－yr)
→ nx－y＝(n－1)yr「いまの合計が
72
歳で，16
年前に母親は子どもの7
倍であった」なら，x＋y＝72 7x－y＝96
足して8x＝168
→ x＝21図 図 図
図
7
年齢算年齢算年齢算年齢算2
のヒントのヒントのヒントのヒント6. その他の問題 その他の問題 その他の問題 その他の問題
ここまで例示した鶴亀算，年齢算のほか，これまでに作成した問題は「濃度算１」「濃度算２」「仕事 算１」「仕事算２」「仕事算３」「仕事算ｎ１」「仕事算ｎ２」「損益算１」「損益算２」「損益算３」「旅人 算１」「旅人算２」「旅人算３」「通過算」「流水算１」「流水算２」「流水算３」「不等式」「資料分析」「ｎ 進数１」「ｎ進数２」「組み合わせ１」「組み合わせ２」「組み合わせ３」「集合
1」
「集合2」などで，非言
語系SPI
問題の半分以上はカバーしていると思う。それぞれの問題でそれぞれに工夫が必要であって，ゆっくりと作りためていくか，あるいは何人かで共同作業をするか，そんなことを思いながらまだ試作 段階にとどまっている。
工夫の例を少し紹介しよう。まず次の濃度算
1
のケース。図 図 図
図
8
濃度算の表示例濃度算の表示例濃度算の表示例濃度算の表示例一般化して「濃度
c1％の塩水 m1g
と濃度c2％の塩水 m2g
を混ぜると，何％の塩水になるか」という 問題で，答えをc
％とすれば，c
m m c
c c − +
=
2 1
* ) 1 2 (
という関係が成り立つ。ここで，c1 を適当な整数，cをそれより少し大きい整数に選び，m2 を適当な
100
の倍数とする。このとき，m1をm2
の整数倍にすると，答えは整数で与えられる。そういう配慮を せずに適当に決めると，答えは小数点以下を伴う実数か，無限小数になる可能性が高い。その場合は「小数点第
*位で四捨五入せよ」という指定が必要となる。
仕事算は，答えを整数にするのが難しいケースで，次の問題は切り上げを指定している。
- 49 -
図図図図
9
仕事算仕事算仕事算仕事算2
の表示例の表示例の表示例の表示例プログラムは次の通りで，値の設定ではそれなりの工夫を施している。
a=ransu(5,10)*2;
b=a+ransu(4,8);
t1=Math.floor(a*0.3)+1;
t2w=(a-t1)/a*b;
t2=Math.floor(t2w); if(t2w>t2) t2++;
ans_t=t1+t2;
document.write("ある仕事をするのに，A
さん1
人では "+a+"日，Bさん1
人では"+b+"日かかる。<br>");
document.write("
始めから"+t1+"
日だけA
さんが仕事をし，残りをB
さんが一人でやると，終了までの総日数は何日か。<br>");
document.write("ただし，小数点以下があるときは切り上げなさい。<br>");
損益算の場合は，仕入れ値を
100
の倍数にし，割引き，割増しを整数にしておくと，答えが整数とな る。図図
図図
10
損益算損益算損益算損益算1
の表示例の表示例の表示例の表示例n
進法は，プログラミングの教材に使えるレベルの問題といえる。ここでは最初に10
進数を決めて，m
進数とn
進数を求めている。図 図 図
図
11 n
進法進法進法進法2
の表示例の表示例 の表示例の表示例<script language="Javascript">
x=ransu(50,99);
m=ransu(2,5);
n=m+ransu(1,4);
w=x;xm="";
50 while(w>0) {
sho=Math.floor(w/m); amari=w-sho*m; xm=amari+xm; w=sho;
}
w=x;xn=""; k10=1;
while(w>0) {
sho=Math.floor(w/n); amari=w-sho*n; xn=amari+xn; w=sho;
}
document.write(m+"進数 "+xm+"を "+n+"進数に変換しなさい。<BR>");
</script>
図
12
の資料分析，図13
の集合もよく出される問題で，事前にしっかり準備しておきたい。図 図 図
図
12
資料分析の表示例資料分析の表示例 資料分析の表示例資料分析の表示例図 図 図
図
13
集合集合集合集合2
の表示例の表示例の表示例の表示例- 51 -
7. おわりに おわりに おわりに おわりに
この
SPI
練習サイトは2012
年まで大学限定のWeb
上で公表していたが，現在は閉じている。簡単なJavascript
プログラムで構成されているとはいえ，プログラムにはバグが付きものであり，そのチェックが必ずしも十分でないのが最大の理由である。
