JavaScriptの算術演算子を完全ガイド！初心者でもわかる基本
新人
「JavaScriptで計算をするにはどうしたらいいですか？」
先輩
「JavaScriptには、計算をするための算術演算子があります。加算や減算、掛け算など、いろいろな計算を簡単に行うことができますよ。」
新人
「算術演算子ってどんなものがあるんですか？」
先輩
「それでは、基本的な算術演算子を紹介していきますね！」
1. 加算（足し算）
加算（足し算）は、2つの数を足してその結果を得る演算です。加算演算子は+です。
次のコードでは、2つの数を足し算し、その結果をページに表示します。
<script>
let num1 = 15;
let num2 = 10;
let result = num1 + num2; // 足し算
document.write("加算結果: " + result); // 結果を表示
</script>
上記のコードでは、num1とnum2を足して、resultにその結果を格納しています。document.write()で"加算結果: 25"が表示されます。
2. 減算（引き算）
減算（引き算）は、2つの数を引き算する演算です。減算演算子は-です。
次のコードでは、2つの数を引き算し、その結果を表示します。
<script>
let num1 = 15;
let num2 = 5;
let result = num1 - num2; // 引き算
document.write("減算結果: " + result); // 結果を表示
</script>
このコードでは、num1からnum2を引いて、結果を表示しています。結果として"減算結果: 10"が表示されます。
3. 乗算（掛け算）
乗算（掛け算）は、2つの数を掛け算する演算です。乗算演算子は*です。
次のコードでは、2つの数を掛け算し、その結果を表示します。
<script>
let num1 = 6;
let num2 = 3;
let result = num1 * num2; // 掛け算
document.write("乗算結果: " + result); // 結果を表示
</script>
このコードでは、num1とnum2を掛け算して、結果として"乗算結果: 18"が表示されます。
4. 除算（割り算）
除算（割り算）は、2つの数を割り算する演算です。除算演算子は/です。
次のコードでは、2つの数を割り算し、その結果を表示します。
<script>
let num1 = 20;
let num2 = 4;
let result = num1 / num2; // 割り算
document.write("除算結果: " + result); // 結果を表示
</script>
このコードでは、num1をnum2で割って、結果として"除算結果: 5"が表示されます。
5. 剰余算（余り）
剰余算は、割り算の余りを求める演算です。剰余算演算子は%です。
次のコードでは、剰余算を使って2つの数の余りを求め、その結果を表示します。
<script>
let num1 = 10;
let num2 = 3;
let result = num1 % num2; // 剰余算
document.write("剰余算結果: " + result); // 結果を表示
</script>
このコードでは、num1をnum2で割った余りを求めています。その結果として"剰余算結果: 1"が表示されます。
6. インクリメント（++）
インクリメントは、変数の値を1増やす演算子です。インクリメント演算子は++です。
次のコードでは、変数の値をインクリメントして、その結果を表示します。
<script>
let num = 5;
num++; // numの値を1増やす
document.write("インクリメント結果: " + num); // 結果を表示
</script>
このコードでは、numの値が1増え、結果として"インクリメント結果: 6"が表示されます。
7. デクリメント（--）
デクリメントは、変数の値を1減らす演算子です。デクリメント演算子は--です。
次のコードでは、変数の値をデクリメントして、その結果を表示します。
<script>
let num = 5;
num--; // numの値を1減らす
document.write("デクリメント結果: " + num); // 結果を表示
</script>
このコードでは、numの値が1減り、結果として"デクリメント結果: 4"が表示されます。
8. 文字列の結合に使われる加算演算子
JavaScriptの加算演算子+は、数値の足し算だけでなく、文字列同士をつなげるときにも使われます。
この仕組みを理解しておくと、画面に表示するメッセージを柔軟に作ることができます。
<script>
let name = "山田";
let message = "こんにちは、" + name + "さん！";
document.write(message);
</script>
この例では、文字列と変数を結合して表示しています。結果として「こんにちは、山田さん！」と表示されます。
9. 計算の優先順位に注意する
JavaScriptでは、算術演算子には計算の優先順位があります。通常は掛け算や割り算が先に実行され、その後に足し算や引き算が行われます。
意図した結果にするためには、必要に応じてカッコを使って計算の順番を明確にしましょう。
<script>
let result1 = 10 + 5 * 2;
let result2 = (10 + 5) * 2;
document.write("result1: " + result1 + "<br>");
document.write("result2: " + result2);
</script>
この場合、result1は20、result2は30になります。カッコの有無で結果が変わる点に注意しましょう。
10. 数値型と文字列型の違いに注意する
JavaScriptでは、数値と文字列を一緒に扱うと、意図しない結果になることがあります。特に加算演算子を使う場合は注意が必要です。
数値として計算したい場合は、データ型を意識して扱うことが重要です。
<script>
let num = 10;
let str = "5";
let result = num + str;
document.write("結果: " + result);
</script>
この例では、数値と文字列が結合されるため「105」と表示されます。数値として計算したい場合は、型の違いに注意しましょう。
