ルービック・クロック

ルービック・クロックとは

ルービック・クロックに関しては、Wikipedia を参照してほしい。 私は単に、この動きを JavaScript で実装したかっただけである。

まず、単一の時計を実装しよう。

時計一個の実装

時計一個の実装は次のとおりである。 初期時刻は短針の 12 時を想定して 12 とする。 時計回りのボタンを 1 回クリックすると時刻が 1 増える。ただし、12 を超えたら 1 に戻る。 反時計回りのボタンを 1 回クリックすると時刻が 1 減る。ただし、1 未満になったら 12 に戻る。

ルービッククロックの動作

次に、ルービッククロックを ルービッククロックは、単一時計を 18 個（うち表9個、裏9個）、ダイヤルを 4 個、ボタンを 4 個持つ。 4 個のボタンがそれぞれ表に出ているか、裏に出ているかによって連動する時計が異なる。 この図では、チェックが入っていないときに表に出ている状態、 チェックが入っているときは裏に出ている（表から押し込まれた）状態を表す。

ルービッククロックの実装と JavaScript の仕様

剰余演算子 % の挙動

結果は必ず左オペランドの被除数（割られる数）と同じ符号になる。つまり、 -3 % 12 = -3 時計の計算では、「現在 3 時で、今から 6 時間戻すと何時か」 という計算をする。このとき、12 時間表記をしているが (3 - 6) % 12 = -3 となるが、-3 時という表現はできない。したがって、 内部の時刻が0以下になったときは 12 を加えて 9 時という言い方をしている。

まりんきょ学問所 ＞ JavaScript 手習い ＞ ルービック・クロック