【JavaScript 入門講座】様々な計算式

[JavaScript 入門講座]様々な計算式

目次

1. 乗算（掛け算）
2. 除算（割り算）
3. 少し複雑な計算式
4. 剰余（割り算の余り）
5. 「割り切れる」という意味
6. べき乗
7. まとめ

前講座で、計算式の計算結果をダイアログに表示するプログラムを見た。

計算式の計算結果をダイアログに表示する alert ( ★計算式★ ) ;

このように、alert () の括弧の中に計算式を記述すると、 計算結果がダイアログに表示する。この事をふまえて、 本講座では、次の事を学習する。

1. 乗算（掛け算）
2. 除算（割り算）
3. 剰余（割り算の余り）
4. べき乗（二乗とか三乗とか）

・・・難しそうである。掛け算と割り算は難しくない。 その下の、剰余やべき乗が難しいだろう。 頑張ろう。

乗算（掛け算）

乗算のプログラムを見る。

001<script>
002alert ( 10 * 5 ) ;
003</script>

このプログラムをファイルに記述してWebブラウザ上で実行しよう。 「50」とダイアログに表示する（以下「ダイアログに表示する」を「表示する」と記載）。 このプログラムは、「 10 * 5 」の計算式の計算結果をダイアログに表示するプログラムである。

乗算の演算子 数値を乗算する場合、　*　記号を利用する。

小学校で学習した掛け算を思い出してほしい。 掛け算をする場合、「×」という記号を記述した。 例えば、10と5を乗算する場合は、「 10 × 5 」と記述したはずである。 しかし、プログラムは違う。 乗算の計算式に「×」は利用しない。「×」の代わりに「*」を利用する。 理由は分からない。しかし、JavaScriptに限らず、多くのプログラム言語で、 乗算に「*（アスタリスク）」を用いる。
さて、「 10 * 5 」は「 10 × 5 」と同じである。この計算式の計算結果は「50」である。 つまり今回のプログラムは、次のプログラムと同じである。

001<script>
002alert ( 50 ) ;
003</script>

「50」が表示する。ここまでは大丈夫だろう。 では、次のプログラムはどうだろう？

001<script>
002alert ( 3 * 2 ) ;
003</script>

このプログラムは「 3 × 2 」の計算式の計算結果をダイアログに表示するプログラムである。 プログラムを実行すると、「6」が表示する。

除算（割り算）

001<script>
002alert ( 10 / 5 ) ;
003</script>

除算の計算式である。数値同士を除算する場合、「 / （スラッシュ）」を利用する。 小学生の頃、割り算には「÷」を利用した。 たとえば、10を5で除算する場合は、 「 10 ÷ 5 」と記述した。しかし、JavaScriptでは、 「÷」記号を利用しない。 「÷」の代わりに、スラッシュを利用する。

除算の演算子 除算する場合、　/　記号を利用する。

001<script>
002alert ( 10 / 5 ) ;
003</script>

さて、このプログラムを実行すると、まず「 10 / 5 」の計算式が計算される。 「 10 ÷ 5 = 2 」である。 つまり、このプログラムは次のプログラムと同じである。

001<script>
002alert ( 2 ) ;
003</script>

プログラムを実行すると「2」と表示する。 さて、つぎのプログラムはどうだろう？

001<script>
002alert ( 5 / 2 ) ;
003</script>

割り算である。「 5 ÷ 2 = 2.5 」である。 つまり、このプログラムは次のプログラムと同じである。

001<script>
002alert ( 2.5 ) ;
003</script>

プログラムを実行すると「2.5」と表示する。 小数点以下（こんかいの場合は、「.5」）も表示する。

少し複雑な計算式

四則演算の複雑な式を見て、理解度を確認する。

001<script>
002alert ( 15 + 5 * 2 ) ;
003</script>

目が回るような計算式である。この計算式は、足し算と掛け算が混ざっている。 一般的な計算式と同様、 足し算よりも掛け算を先に計算する。 プログラムは、まず「 5 * 2 」の処理を実行する。

001<script>
002alert ( 15 + 10 ) ;
003</script>

「 5 * 2 」の処理が実行され、「10」になる。この後、加算処理が実行する。

001<script>
002alert ( 25 ) ;
003</script>

プログラムを実行すると、「25」と表示する。
もう一つサンプルを掲載する。

001<script>
002alert ( 5 * ( 2 + 8 ) ) ;
003</script>

プログラムを実行すると「50」と表示する。 掛け算は足し算に優先して実行する。 しかし、足し算の計算式が「( 2 + 8 )」のように括弧で囲まれている場合は、 一般的な計算と同様、括弧の中の計算式が優先的に実行される。

001<script>
002alert ( 5 * 10 ) ;
003</script>

このように、括弧の中の足し算から実行する。

001<script>
002alert ( 50 ) ;
003</script>

最終的に、alert()関数の括弧の中は「50」になる。

剰余（割り算の余り）

アプリケーションを製造していると、「割り算の余り」を利用する場面に遭遇する。 「割り算の余り？なんの役に立つのだろうか？余り物には福があるとか、そういう事かな？」と疑問に思うかもしれない。 私はその疑問に答えるために、「割り算の余り」を利用する事例を 可及的速やかに星の数ほど挙げる事ができる。
ただし、ここで言及する事はない。なぜなら、 「割り算の余り」を利用するプログラムは複雑であり、今ここで解説しても意味がないからである。 だが、例示するぐらいなら問題ないだろう。

1. ランダムな文字列をアルファベットから作成する場合
2. 表（テーブル）を表示する際、1行ずつ背景色を変更する場合
3. 大量のデータを複数の表（テーブル）で表示する際、表示するデータを抽出する場合
4. ゲームでキャラクターの画像を入れ替える場合

可及的速やかに思いつく事例は以上である。星の数は思いのほか少ない。 いずれにせよ、「割り算の余り」を利用するプログラムは複雑である。 そして、「割り算の余り」を利用すると、複雑なプログラムを、 劇的に簡単に記述できる。 この事は、プログラムを記述する際、常に思い起こさなくてはならない。

剰余とは 剰余とは、割り算の余りである。

「 10 ÷ 3 = 3 ... 1 」という計算式があるとする。 この時、「1」が余りである。この余りを、別名「剰余」と言う。
では、剰余を利用したサンプルプログラムを見る。

001<script>
002alert ( 10 % 3 ) ;
003</script>

このプログラムは「 10 % 3 」の計算結果を表示するプログラムである。 計算式「 10 % 3 」は、見た事も聞いた事もない。

剰余の求め方 数値1 % 数値2
：　数値1を数値2で除算した余りを算出する式

剰余を求める式である。例として、「 10 % 3 」を見てみよう。
まず疑いなく、「 10 ÷ 3 = 3 余り 1 」である。 余りは「1」である。
「 10 % 3 」は「 10 ÷ 3 」の余りを意味する。つまり、「 10 % 3 = 1 」となる。 むずかしい。むずかしい。

001<script>
002alert ( 10 % 3 ) ;
003</script>

このプログラムは次のプログラムと同じである。

001<script>
002alert ( 1 ) ;
003</script>

プログラムを実行すると、「1」と表示する。 むずかしい。むずかしいのでもう一つサンプルを掲載する。

001<script>
002alert ( 10 % 2 ) ;
003</script>

このプログラムは、「 10 ÷ 2 」の余りを意味する。
「 10 ÷ 2 = 5 余り 0 」である。 つまり、「 10 % 2 」の計算結果は、「0」である。

001<script>
002alert ( 10 % 2 ) ;
003</script>

このプログラムは次のプログラムと同じである。

001<script>
002alert ( 0 ) ;
003</script>

プログラムを実行すると、「0」と表示する。

「割り切れる」という意味

ある数がある数で割り切れるかどうかを知りたい場合、 「 % 」記号を利用する。

001<script>
002alert ( 10 % 2 ) ;
003</script>

プログラムを実行すると「0」が表示する。 「0」が表示するという事は、余りが「0」という事である。 つまり、「10は2で割り切れる」という事を意味している。

AがBで割り切れるか知りたい A % B の値を見て、「0」の場合は割り切れる。 「0」以外の場合は割り切れない。

JavaScriptでは、「AがBで割り切れるか確認する命令文」は存在しない。
その代わりに、 「 A % B 」のプログラムを書いて、この値が「0」か「0」以外か確認する。
念のため、次のプログラムを見る。

001<script>
002alert ( 20 % 6 ) ;
003</script>

プログラムを実行すると、「2」と表示する。 つまり、20は6で割り切れない事を意味する。
解説は以上である。

べき乗( Math.pow()を利用)

新しい命令文を利用して、べき乗の計算をする。

Math.pow ( A , B ) AのB乗

べき乗を計算する場合、「 Math.pow() 」命令文を利用する。 すでにalert()命令文は学習した。 こんかいは、Math.pow()命令文を学習する。 Math.pow()命令文はべき乗を求める命令文である。

1. Math.pow()の括弧の中に2つの数字を記述する
2. 1つ目の数字をAとして、2つ目の数字をBとする
3. この場合、AのB乗の値が計算される

具体的な数値を当てはめたほうが良かろう。

001<script>
002alert ( Math.pow ( 10 , 3 ) ) ;
003</script>

このプログラムは「 10の3乗 」を計算して、計算結果を表示するプログラムである。

Math.pow ( 10 , 3 ) Math.pow ( A , B )
A = 10
B = 3
AのB乗 = 10の3乗

Math.pow ( 10 , 3 )
= 10 の 3 乗
= 10 × 10 × 10
このようになる。 こんかいのプログラムは次のプログラムと同じである。

001<script>
002alert ( 10 * 10 * 10 ) ;
003</script>

Math.pow ( 10 , 3 )
= 10 × 10 × 10
= 1000である。 こんかいのプログラムは次のプログラムと同じである。

001<script>
002alert ( 1000 ) ;
003</script>

このプログラムを実行すると、「1000」とダイアログに表示する。 次のプログラムはどうだろうか？

001<script>
002alert ( Math.pow ( 3 , 3 ) ) ;
003</script>

このプログラムは「 3の3乗 」を計算して、計算結果を表示するプログラムである。

Math.pow ( 3 , 3 ) = 3 × 3 × 3 である。 プログラムは次のプログラムと同じである。

001<script>
002alert ( 3 * 3 * 3 ) ;
003</script>

alert()の括弧の中の計算を実行する。

001<script>
002alert ( 27 ) ;
003</script>

プログラムを実行すると「27」と表示する。 本講座は以上である。

まとめ

乗算 乗算する場合、　*　記号を利用する。

除算 除算する場合、　/　記号を利用する。

剰余 数値1 % 数値2
：　数値1を数値2で除算した余りを算出する式

Math.pow ( A , B ) AのB乗