カテゴリ: JavaScript 更新日: 2025/11/28

JavaScriptの数値演算(+ - * / %)の基本を初心者向けに解説

JavaScriptの数値演算(+ - \* / %)の基本を初心者向けに解説
JavaScriptの数値演算(+ - \* / %)の基本を初心者向けに解説

先生と生徒の会話形式で理解しよう

生徒

「先生、JavaScriptで計算をするときってどうやるんですか?電卓みたいなことができるんですか?」

先生

「もちろんできますよ!JavaScriptには数値を計算するための“数値演算子(すうちえんざんし)”があります。たとえば、たし算やひき算などです。」

生徒

「なるほど。電卓で使う記号みたいなものなんですね!」

先生

「そのとおり!では、JavaScriptでよく使う演算子の使い方を順番に見ていきましょう。」

1. 数値演算とは?

1. 数値演算とは?
1. 数値演算とは?

JavaScript(ジャバスクリプト)では、数値を使って計算を行うことができます。計算に使う記号のことを演算子(えんざんし)と呼びます。演算子を使えば、足し算・引き算・掛け算・割り算・余りなどを自由に計算できます。

たとえば、「りんごが3個あって、2個追加したら全部で何個?」というような問題も、プログラムで簡単に計算できるのです。

2. 足し算(+)

2. 足し算(+)
2. 足し算(+)

「+」は、2つの数を足すための演算子です。


let a = 5;
let b = 3;
let sum = a + b;
console.log(sum);

8

この例では、5と3を足して8になります。+は、もっともよく使う演算子です。なお、+は文字列(もじれつ)をつなげるときにも使われますが、それは別の記事で説明します。

3. 引き算(-)

3. 引き算(-)
3. 引き算(-)

「−」は、数を引くための演算子です。


let x = 10;
let y = 4;
let result = x - y;
console.log(result);

6

10から4を引くので、結果は6になります。計算の流れは紙の計算と同じです。

4. 掛け算(*)

4. 掛け算(*)
4. 掛け算(*)

「*」(アスタリスク)は、掛け算の演算子です。


let num1 = 7;
let num2 = 2;
let product = num1 * num2;
console.log(product);

14

「×」ではなく「*」を使うのがJavaScriptの書き方です。パソコンのキーボードでは「Shift + 8」で入力できます。

5. 割り算(/)

5. 割り算(/)
5. 割り算(/)

「/」(スラッシュ)は、割り算の演算子です。


let total = 20;
let count = 4;
let avg = total / count;
console.log(avg);

5

20 ÷ 4 の結果として 5 が表示されます。もし割り切れない場合は、小数点を含んだ結果が表示されます。


console.log(7 / 2);

3.5

JavaScriptでは整数も小数も同じ「Number型」として扱われるため、小数点を使った計算も自然にできます。

6. 余りを求める(%)

6. 余りを求める(%)
6. 余りを求める(%)

「%」(パーセント記号)は、割り算の余りを求める演算子です。

たとえば「10 ÷ 3」は、3が3回入って余りが1になります。その“余り”を求めるのが%です。


let m = 10;
let n = 3;
let remainder = m % n;
console.log(remainder);

1

この演算は、「2で割り切れるかどうか」を調べたいときなどにもよく使われます。たとえば、偶数・奇数の判定です。


let number = 7;
if (number % 2 === 0) {
  console.log("偶数です");
} else {
  console.log("奇数です");
}

奇数です

このように%を使うと、条件分岐にも活用できます。

7. 計算の優先順位(演算の順番)

7. 計算の優先順位(演算の順番)
7. 計算の優先順位(演算の順番)

JavaScriptでは、計算の順番にルールがあります。数学と同じように、掛け算や割り算は足し算・引き算よりも先に計算されます。


let result = 2 + 3 * 4;
console.log(result);

14

上の例では、先に「3 × 4」が計算されて12、そのあとに「2 + 12」で14になります。

もし「2 + 3」を先に計算したい場合は、かっこ( )を使って順番を変えます。


let result2 = (2 + 3) * 4;
console.log(result2);

20

かっこをつけることで、「2 + 3」が先に計算され、結果は20になります。かっこを使うと意図した通りの計算ができます。

8. マイナスの数(負の数)を使う

8. マイナスの数(負の数)を使う
8. マイナスの数(負の数)を使う

JavaScriptでは、マイナスの数もそのまま書けます。たとえば、「−5」や「−10」のように、数字の前にマイナス記号をつけるだけです。


let negative = -5;
let positive = 10;
console.log(negative + positive);

5

負の数も普通の数と同じように計算できます。これもNumber型として扱われます。

9. 複雑な計算をまとめて書く

9. 複雑な計算をまとめて書く
9. 複雑な計算をまとめて書く

JavaScriptでは、複数の演算を1行で書くこともできます。たとえば、商品の価格と個数、税率をまとめて計算できます。


let price = 100;
let quantity = 3;
let tax = 0.1;
let total = price * quantity * (1 + tax);
console.log(total);

330

このように、「掛け算」「足し算」「かっこ」を組み合わせれば、日常的な計算もすぐにプログラムにできます。

10. まとめ:数値演算をマスターすればプログラムが動き出す

10. まとめ:数値演算をマスターすればプログラムが動き出す
10. まとめ:数値演算をマスターすればプログラムが動き出す

JavaScriptの数値演算は、プログラミングの最初のステップとしてとても大切です。足し算・引き算・掛け算・割り算・余り、この5つを理解すれば、ほとんどの基本的な計算ができます。

今後、条件分岐やループ処理などを学ぶときにも、この数値演算の考え方が何度も登場します。しっかりと覚えておきましょう。

カテゴリの一覧へ
新着記事
New1
TypeScript
TypeScriptでパスエイリアスを設定する方法!baseUrlとpathsでコードをスッキリ整理
New2
JavaScript
JavaScriptのfor文の書き方を初心者向けにやさしく解説
New3
JavaScript
JavaScriptの関数でよくあるエラーとその解決法まとめ
New4
JavaScript
JavaScriptのイベント処理でよくあるエラーとその対処法
人気記事
No.1
Java&Spring記事人気No1
JavaScript
JavaScriptのインストール方法まとめ!Windows・Mac・Linux別にステップ解説
No.2
Java&Spring記事人気No2
JavaScript
JavaScriptのマウスイベントの使い方(click, mouseoverなど)
No.3
Java&Spring記事人気No3
JavaScript
JavaScriptのtoStringとString関数の違いを初心者向けに解説
No.4
Java&Spring記事人気No4
JavaScript
JavaScriptの純粋関数(pure function)と副作用の違いを理解しよう
No.5
Java&Spring記事人気No5
JavaScript
JavaScriptプログラムの実行方法まとめ!ブラウザ・Node.js・コンソールの使い方
No.6
Java&Spring記事人気No6
JavaScript
JavaScriptで文字列をforループで1文字ずつ処理する方法!初心者向け解説
No.7
Java&Spring記事人気No7
TypeScript
TypeScriptの始め方:開発環境の構築手順【初心者向け】
No.8
Java&Spring記事人気No8
JavaScript
JavaScriptのDOMContentLoadedとloadイベントの違いを理解しよう