【初心者向け】JavaScriptの数学入門:算術演算子の基本をマスターしよう
コンピュータは計算がとても得意です。コンピュータは0と1の二進数(バイナリ)によって動いているため、計算能力はまさにその「血」に刻まれていると言えるでしょう。プログラミングをしていると、何らかの数学的な処理を行いたい場面は必ず訪れます。
JavaScriptにおいても、数値計算はあらゆる場面で登場します。たとえば、ウィンドウのサイズを計算したり、ユーザーがサイトを利用できる年齢かどうかを判定したり、ユーザーが入力した2つの数値を合計したりするのに、数学が使われます。
このガイドでは、JavaScriptで主要な6つの算術演算子を使って数学的な操作を行う方法について解説します。
算術演算子のおさらい
JavaScriptはさまざまな演算子で構成されています。文字列を扱うための演算子もあれば、数値計算を行うための演算子もあります。このガイドでは、その中でも「算術演算子」と呼ばれる特別な種類の演算子に焦点を当てます。
算術演算子とは、数学的な処理を実行するために使われる記号のことです。これらの演算子は、学校で習った数学の記号とよく似ています。本記事では、以下の6つの演算子を取り上げます。
- 加算(+)
- 減算(-)
- 除算(/)
- 乗算(*)
- 剰余(%)
- べき乗(**)
それでは、それぞれの演算子について詳しく見ていきましょう。
始める前に、1つ重要なポイントをお伝えしておきます。JavaScriptでは、すべての数値は「数値(number)」という1つの型として扱われます。浮動小数点数(小数)と整数で別々のデータ型が用意されているわけではなく、すべて「数値」として統一されているのです。
足し算と引き算
JavaScriptで数値の足し算や引き算を行う記号は、日常の数学で使うものと同じです。これは便利ですね。数値を足すには、加算したい数値をプラス記号(+)で区切って並べるだけです。
console.log(5 + 9);
このコードは「14」を返します。引き算を行う場合は、プラスをマイナス(-)に置き換えるだけです。
console.log(5 - 9);
このコードは「-4」を返します。JavaScriptの計算は、正の数でも負の数でも問題なく扱えます。
実際の開発では、計算結果を単にコンソールに出力するだけではないでしょう。そこで活躍するのが変数です。変数を使えば、計算に使う数値を格納して管理できます。
var a = 10;
var b = 20;
var c = a + b;
console.log(c);
このコードは「30」を返します。変数aに10、変数bに20を代入し、変数cでこの2つの数値を足し合わせています。とてもシンプルですね。
掛け算と割り算
次にレベルアップして、掛け算と割り算について見ていきましょう。ここでは、新しく2つの演算子を覚える必要があります。
- アスタリスク(*)は掛け算(乗算)を表します。
- スラッシュ(/)は割り算(除算)を表します。
例として、クッキー店を経営しているとしましょう。小麦粉が何kg必要かを計算したいとします。クッキー1バッチにつき小麦粉2kgが必要で、5バッチ焼きたい場合、次のコードで必要な小麦粉の量を計算できます。
var batches = 5;
var flourQuantity = 2;
var flourNeeded = batches * flourQuantity;
console.log("You need ", flourNeeded, "kgs of flour.");
このコードは「You need 10kgs of flour.(小麦粉が10kg必要です)」を返します。
割り算にはスラッシュ(/)を使用します。
今度は、各バッチに40個のクッキーが入っていて、それをパックに分けたいとしましょう。1パックに5個のクッキーが入るとすると、何パック作れるのかを知りたいわけです。これは次のコードで求められます。
var batchQuantity = 40;
var pack = 5;
var packsMade = batchQuantity / pack;
console.log("You can make ", packsMade, "packs of cookies.");
このコードは「You can make 8 packs of cookies.(8パック作れます)」を返します。
剰余(モジュロ)
剰余演算子は他の演算子ほど頻繁に使われるわけではありませんが、JavaScriptにおいて依然として重要な存在です。剰余演算子は、ある数を別の数で割ったときの「余り」を計算します。
JavaScriptでは、剰余演算はパーセント記号(%)で表されます。先ほどの例では、きれいに割り切れる数値を扱いました。しかし、ご存じのとおり、すべての計算が割り切れるとは限りません。余りが出ることもあります。
再びクッキーの例に戻りましょう。1バッチで焼けるクッキーの数を見積もりすぎていたことが判明しました。実際には、各バッチで焼けるのは37個だけです。このバッチから何パック作れるかを調べるには、次のコードが使えます。
var batchQuantity = 37;
var pack = 5;
var packsMade = batchQuantity / pack;
console.log("You can make ", packsMade, "packs of cookies.");
ところが、問題発生です。結果が小数になってしまいました! ここで剰余演算子の出番です。コードを修正して、余ったクッキーの数も計算してみましょう。
var batchQuantity = 37;
var pack = 5;
var packsMade = batchQuantity / pack;
console.log("You can make ", Math.floor(packsMade), "packs of cookies.");
var remainder = batchQuantity % pack;
console.log("You'll have ", remainder, " cookies left over.");
このコードは以下を返します。
You can make 7 packs of cookies.
You'll have 2 cookies left over.
このコードでは、いくつかの修正を行っています。まず、Math.floor()を使ってpacksMadeの値を最も近い整数に切り下げました。これにより、完成品のパックは7パック作れることがわかります。
次に、剰余演算子(%)を使って、パックに分けた後に残るクッキーの数を計算しました。この結果、パックに分けた後、クッキーが2個余ることがわかります。
補足:Math.floor() について
Math.floor()は、引数として渡した数値を切り下げて整数にするJavaScriptの組み込みメソッドです。7.4を渡せば7を返します。同様に、切り上げにはMath.ceil()、四捨五入にはMath.round()を使うことができます。
べき乗
xのy乗——「べき乗」や「指数」という言葉を聞くと難しそうに感じますが、実際はそれほど複雑ではありません。
JavaScriptでは、アスタリスク2つ(**)で数値のべき乗を表します。
console.log(7 ** 3);
このコードは「343」を返します。
これは7 * 7 * 7と書くことと同じですが、より短く、読みやすいコードになります。
演算の優先順位
数学には「演算の優先順位」があります。これは、数式を評価するときに、どの演算をどの順番で行うべきかを定めたルールです。
この順序を覚える方法として最も一般的なのが「BODMAS」です。
- Brackets:括弧(())
- Order:べき乗
- Division:除算
- Multiplication:乗算
- Addition:加算
- Subtraction:減算
つまり、まず括弧の中をすべて計算し、次にべき乗、続いて除算……という順序で計算を進めるということです。次の例を見てみましょう。
var problem = (5 * 3) + 2;
console.log(problem);
この式の答えは「17」です。JavaScriptはまず括弧内の5 * 3を計算し、その結果に2を足します。
ちなみに、日本の学校教育では「括弧→指数→乗除→加減」の順序として教えられることが多く、考え方はBODMASと同じです。
まとめ
JavaScriptには、数学的な操作を行うために使える多彩な算術演算子が用意されています。加算のように日常の数学と同じ記号のものもあれば、独自の記号を持つものもあります。
また、数式を評価するときは、BODMASに代表される演算の優先順位を考慮する必要があることも忘れないでください。
これであなたも、プロのようにJavaScriptで計算をする準備が整いました!
-
JavaScriptで数値を丸める・切り捨てる方法|Math.round()とMath.trunc()の違いと使い方
JavaScriptには、小数を整数へ変換するためのメソッドとして、Math.round() と Math.trunc() の2つが標準で用意されています。Math.round():小数点以下を四捨五入し、最も近い整数に丸めます。例えば「3.5」は「4」に、「3.4」は「3」になります。Math.trunc():小数点以下を単純に取り除き、整数部分だけを残します。「3.9」も「3.1」もどちらも「3」になります。それぞれの特徴を踏まえながら、実際のコード例を見ていきましょう。Math.round() と Math.trunc() の違いメソッド動作例(3.999)Math.round()四捨五
-
JavaScriptで桁の和が回文数かどうかを判定する関数を作る方法
問題概要今回は、数値 num を第1引数(唯一の引数)として受け取る JavaScript 関数を作成します。この関数は、num の各桁の数字を合計した値が回文数(palindrome number)である場合に true を返し、そうでない場合は false を返す必要があります。例えば、関数への入力が次のようだったとします。const num = 781296;このとき、期待される出力は以下の通りです。const output = true;出力の解説781296 の各桁の和を計算すると、7 + 8 + 1 + 2 + 9 + 6 = 33 となります。33 は左右から読んでも同じ値になる