サイトアイコン Pro Web Engineer

【JavaScript超入門】演算子の使い方まとめ

今回は、JavaScriptの演算子について学習していきましょう。

演算子とは、+やーを使った基本的な計算や、比較の時に使用する==など

これらはすべて演算子です。

演算子と聞くと少し難しく感じるかもしれませんが、基本的な計算の方法や、比較の方法を確認するんだなーと思ってもらえればOKです。

算術演算子:基本的な計算

計算など数学的な演算を行うのが算術演算子です。JavaScriptの計算方法について確認しましょう。

足し算 + num1 + num2
引き算 num1 – num2
掛け算 * num1 * num2
割り算 / num1 / num2
余り % num1 % num2

インクリメント演算子 / デクリメント演算子

インクリメント演算子、デクリメント演算子とは、数字を+1、ー1する書き方です。

let num = 1;
num = num + 1;
num++; // 同じこと
console.log(num); // 2

num = num + 1; と書いても、 num++ と書いても、処理は同じことです。

++ と書くことで +1

— と書くことで -1

されることは覚えておきましょう

また、++num, num++ のように++を前方、後方に置いたときの違いも押さえておきましょう。

let num1 = 1;
let num2 = num1++;

console.log(num1); // 2
console.log(num2); // 1
let num1 = 1;
let num2 = ++num1;

console.log(num1); // 2
console.log(num2); // 2

let num2 = num1++; はnum2 にnum1 を代入してから、num1 を+1

let num2 = ++num1; はnum1 を+1してから、num2 にnum1 を代入

しています。

この違いを理解しておかないと、バグにつながることもございますので

++ を前方、後方に置いた時の違いはしっかりと理解しておきましょう。

代入演算子

計算と代入を一度にしてくれる演算子です。

足し算 += num += 1
引き算 num -= 1
掛け算 * num *= 2
割り算 / num /= 3
余り % num %= 2

まずはこのあたりの基本を押さえておけばOKです。

比較演算子

== a == b a と b は等しい
!= a != b a と b は等しくない
< a < b a より b の方が大きい
<= a <= b b は a 以上
> a > b a と b より大きい
>= a >= b a は b 以上
=== a === b a と b は等しい
!== a !== b a と b は等しくない

等価演算子 (==) と厳密演算子 (===) の違い

== と === の違いは、厳密演算子 === はデータの型まで比較します。

console.log('1' === 1); // false
console.log('1' == 1); // true

データの型まで比較しない緩い比較だと、バグにつながる可能性があるので

比較は厳密演算子 === で書くようにしましょう

 

論理演算子

複数の条件式をつなぐ演算子です。

&& num1 === 1 && num2 === 2
|| num1 === 1 || num2 === 2

&& は「かつ」、|| は「または」になります。

num1 === 1 && num2 === 2

は、num1 が1である、かつnum2 が2である

num1 === 1 || num2 === 2

は、num1 が1である、またはnum2 が2である

になります。

if文の条件式に使用しますので、押さえておきましょう^^

モバイルバージョンを終了