JavaScript勉強会

JavaScriptの学習日記

3.9 FizzBuzz 《算術演算子》 【JavaScript超入門】

JavaScriptの学習メモ。

今日は『確かな力が身につくJavaScript「超」入門』の第3章を読んでみます。

 

jsstudy.hatenablog.com

 

 

3.9 算術演算子

(p.119)

FizzBuzzというゲームをプログラムで実現してみましょう。

これまでも +、-、*と、計算のための記号をあまり詳しく説明せずに使ってきましたが、この実習でも新たに割り算の余りを算出する%記号を使います。

 

FizzBuzzとは?

f:id:jsstudy:20170423010825p:plain

 

FizzBuzzとは、何人か組になって、「1」「2」と順番に数字を言っていき、3で割り切れる数字のときは「Fizz!」、5で割り切れるときは「Buzz!」、3でも5でも割り切れるときは「FizzBuzz!」と叫ぶゲームです。

 

Fizz Buzz - Wikipedia

Fizz Buzz(フィズ・バズ、Bizz BuzzやBuzzとも呼ばれる)は英語圏で長距離ドライブ中や飲み会の時に行われる言葉遊びである。

 

遊び方

プレイヤーは円状に座る。最初のプレイヤーは「1」と数字を発言する。次のプレイヤーは直前のプレイヤーの次の数字を発言していく。ただし、3で割り切れる場合は「Fizz(Bizz Buzzの場合は「Bizz」)、5で割り切れる場合は「Buzz」、両者で割り切れる場合(すなわち15で割り切れる場合)は「Fizz Buzz」(Bizz Buzzの場合は「Bizz Buzz」)を数の代わりに発言しなければならない。発言を間違えた者や、ためらった者は脱落となる。

 

ゲーム例

ゲームは、以下のとおりに発言が進行する。
1, 2, Fizz, 4, Buzz, Fizz, 7, 8, Fizz, Buzz, 11, Fizz, 13, 14, Fizz Buzz, 16, 17, Fizz, 19, Buzz, Fizz, 22, 23, Fizz, Buzz, 26, Fizz, 28, 29, Fizz Buzz, 31, 32, Fizz, 34, Buzz, Fizz, ...

 

FizzBuzz問題

このゲームをコンピュータ画面に表示させるプログラムとして作成させることで、コードが書けないプログラマ志願者を見分ける手法をJeff AtwoodがFizzBuzz問題 (FizzBuzz Question) として提唱した。

「制限時間2分以内」「剰余(%記号等)を用いない」「1行でできる限り短く(ワンライナー)」等の縛りでゲーム条件を満たすコード記述の腕試しをする者が続出した。

 

サンプルコード

「index.html」というファイルを作り、以下の内容を書きます。

<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>3-09_fizzbuzz</title>
</head>
<body>
    <h1>30までの数でFizzBuzz</h1>
    <script>
        var fizzbuzz = function (num) {
            if (num % 3 === 0 && num % 5 === 0) {
                return 'fizzbuzz';
            } else if (num % 3 === 0) {
                return 'fizz';
            } else if (num % 5 === 0) {
                return 'buzz';
            } else {
                return num;
            }
        }
        for (var i = 1; i <= 30; i++) {
            console.log(fizzbuzz(i));
        }
    </script>
</body>
</html>

 

実行結果

「index.html」をChromeで開いて、コンソール画面を出します。

以下のような実行結果になりました。

f:id:jsstudy:20170423003333p:plain

 

fizzbuzz()関数が正常に動作していることが分かります。

 

算術演算子

developer.mozilla.org

 

  • 加算 (+)
  • 減算 (-)
  • 除算 (/)
  • 乗算 (*)
  • 剰余 (%)
  • べき乗 (**)

 

四則演算(+、-、*、/)以外の演算子を確認してみましょう。

 

剰余演算子 %

剰余 (%)

剰余演算子は1つ目の数値を2つ目の数値で割った余りを返します。

 

12 % 5  // 2
-1 % 2  // -1
NaN % 2 // NaN
1 % 2   // 1
2 % 3   // 2
-4 % 2  // -0
5.5 % 2 // 1.5

 

(例)12 ÷ 5の余りは2なので、12%5は2になります。 

 

冪乗演算子 **

べき乗 (**)

べき乗は1つ目の数値を2つ目の数値でべき乗した値を返します。

 

2 ** 3   // 8
3 ** 2   // 9
3 ** 2.5 // 15.588457268119896
10 ** -1 // 0.1
NaN ** 2 // NaN

2 ** 3 ** 2   // 512
2 ** (3 ** 2) // 512
(2 ** 3) ** 2 // 64

 

(例)2の3乗(2を3回かける、2*2*2)は8なので、2 ** 3は8になります。

 

まとめ

 

剰余演算子を活用して、スッキリしたプログラムを書きたいです。