今回はJavaScriptで四則演算をする方法を解説します。
JavaScriptに限らず、四則演算はプログラミングの基礎と言えます。
やり方はそこまで難しくないので、足し算や引き算のやり方をしっかり覚えましょう。
また、四則演算以外の演算方法についても併せて触れていきます。
本記事を読むことで、四則演算に関することはマスターできますよ。
JavaSciptで数値を表示する
四則演算のやり方の前に、まずJavaScriptで数値を表示する方法をみていきましょう。
○コード例
<!DOCTYPE html>
<html>
<head>
<title>テスト画面</title>
</head>
<body>
<script>
document.write(1)
</script>
</body>
</html>○実行結果
JavaScriptで文字列や数値を表示する場合「document.write」を使います。
scriptタグの中を変更に、上記のように記述してください。
注意点ですが、文字列ではなく数値を表示する場合、””で括る必要はありません。
実行結果を確認すると、ブラウザに「1」と表示されていることが分かります。
数値ではなく文字列を表示する方法は、【入門編1】JavaScriptとは?Hello Worldの出し方を学ぼうで解説しているので、こちらをお読みください。
JavaSciptで四則演算を行う方法
それではJavaScriptで四則演算を行う方法をみていきましょう。
本記事では基本的な四則演算方法と、その他の演算方法に分けて解説します。
基本的な四則演算を行う
まずはJavaScriptで足し算を行いましょう。
○コード例
<!DOCTYPE html>
<html>
<head>
<title>テスト画面</title>
</head>
<body>
<script>
document.write(4+2)
</script>
</body>
</html>○実行結果
足し算を行う場合、上記のように「+」という記号を使います。
4+2は6ですので、実行するとブラウザに「6」が表示されます。
続いて、引き算を行います。
○コード例
<script>
document.write(4-2)
</script>○実行結果
引き算を行う場合は「-」を使います。
ブラウザに「2」か表示されます。
続いて、掛け算を行います。
○コード例
<script>
document.write(4*2)
</script>○実行結果
掛け算を行う場合は「*」という記号を使います。
プログラミングでは「×」という記号は使いません。
掛け算の場合全て「*」を使うので注意しましょう。
最後に、割り算を行います。
○コード例
<script>
document.write(4/2)
</script>○実行結果
割り算を行う場合は「/」という記号を使います。
プログラミングでは「÷」という記号は使いません。
掛け算と割り算は、プログラミング特有の記号を使います。
そこさえ気をつければ、JavaScriptでの四則演算は難しくないでしょう。
なお、掛け算や足し算が混じった演算も、もちろん可能です。
例をみていきましょう。
○コード例
<!DOCTYPE html>
<html>
<head>
<title>テスト画面</title>
</head>
<body>
<script>
document.write(5*4+2)
</script>
</body>
</html>○実行結果
5*4+2の結果である「22」が表示されています。
また、「()」を使うことで、足し算から計算することも可能です。
○コード例
<script>
document.write(5*(4+2))
</script>○実行結果
先程とは違い、30が表示されていますね。
このあたりは通常の計算と同じなので、分かりやすいでしょう。
その他の演算を行う
四則演算以外にも、JavaScriptではいくつかの演算処理が可能です。
まず割り算の「余り」を表示する方法を解説します。
○コード例
<!DOCTYPE html>
<html>
<head>
<title>テスト画面</title>
</head>
<body>
<script>
document.write(5%2)
</script>
</body>
</html>○実行結果
割り算の余りを表示する場合「%」を使います。
5/2の余りは1なので「1」が表示されます。
プログラムにおいて、割り算の余りの値を使用する機会は、多くあります。
たとえば、数値が偶数か奇数かを見分ける際、2で割った余りが1か0かで判別します。
最後に乗算のやり方を紹介します。
○コード例
<!DOCTYPE html>
<html>
<head>
<title>テスト画面</title>
</head>
<body>
<script>
document.write(5**2)
</script>
</body>
</html>○実行結果
乗算を行う場合は「**」という記号を使います。
「*」を2回使うことで乗算を表すのです。
5の2条は25なので「25」が表示されます。
乗算をする場合もたまにあるので、このやり方も覚えておきましょう。
以上がJavaScriptでの演算の基本となります。
まとめ
本記事ではJavaScriptでの四則演算方法について解説しました。
四則演算の方法や、割り算の余りを取得する方法、乗算を行う方法がお分かり頂けたかと思います。
今回は簡単な例を紹介しましたが、もっと大きな数の計算をすることももちろん可能です。
本記事のサンプルコード内の数値を変更し、どんな表示結果になるか確認してみましょう。
次回は、JavaScriptで変数を扱う方法について解説します。
