ソフトウェア開発者の日常

こだわりなく書きたいことを書いていきます。

JavaScriptのオブジェクトを少し学びました

あるシステムで、データに対して5から-2の点数をつけることになりました。
複数のデータに対して、それぞれ点数をつけなければなりません。
何点を何個つけたのかを数える機能も必要です。

例えば、3個データがあって、2個のデータに2点、1個のデータに-1点をつけた場合、
5点:0個
4点:0個
3点:0個
2点:2個
1点:0個
0点:0個
−1点:1個
−2点:0個
と表示しなければなりません。

formのsubmitで遷移したタイミングで選ばれた点数を数えるのであれば、GETまたはPOSTでサーバー側に渡されたデータを元に集計すれば実現できます。
そうではなくて、ラジオボタンをクリックされたタイミングでformのsubmitをしないで数えなければなりません。
そのため、JavaScriptで実現する方法を考えました。

f:id:AJYA:20160524075805j:plain
photo credit: Running Orc mit p5.js via photopin (license)

サーバー側で集計するなら

PHPなら連想配列

$pointsArr = array(
	5 => 0,
	4 => 0,
	3 => 0,
	2 => 0,
	1 => 0,
	0 => 0,
	-1 => 0,
	-2 => 0);

と定義します。
選ばれた点数がキーになっているので、選ばれた点数のキーに対する値に1を加算していけば、集計ができます。
PHP: 配列 - Manual

JavaScriptで集計する方法

JavaScriptで同じように集計しようと、配列の添え字にマイナスを使っても大丈夫か検索したら、一般的ではないようです。
他に方法はないかと検索すると、オブジェクトが使えそうだとわかりました。
JavaScriptで覚えておくとよいデータ構造 - 配列・オブジェクト - いろいろ解析日記

オブジェクトで

var pointsObject = { "5": 0, "4": 0, "3": 0, "2": 0, "1": 0, "0": 0, "-1": 0, "-2": 0 };

と定義して、選ばれた点数のキーに対する値に1を加算していって、集計を実現しました。


JavaScriptでの実現方法に悩みましたが、オブジェクトが使えることがわかってからは早かったです。