ITコース JavaScript基礎 040_演算子

JavaScript 演算子は、数学演算、比較、論理演算などの操作を実行し、結果を返すために使用されます。

算術演算子

+：加算
-：減算
*：乗算
/：除算
%：剰余
**：べき乗

例：

1
let a = 5;
2
let b = 2;
3

4
console.log(a + b);  // 出力 7
5
console.log(a - b);  // 出力 3
6
console.log(a * b);  // 出力 10
7
console.log(a / b);  // 出力 2.5
8
console.log(a % b);  // 出力 1
9
console.log(a**b);  // 出力 25

代入演算子

=：代入
+=：加算代入
-=：減算代入
*=：乗算代入
/=：除算代入
%=：剰余代入
**=：べき乗代入
??=：null合体代入、変数値がnullまたはundefinedの場合のみ代入

例：

1
let x = 5;
2
x += 2;  // x = x + 2; 出力 7
3
x -= 2;  // x = x - 2; 出力 3
4
x *= 2;  // x = x * 2; 出力 10
5
x /= 2;  // x = x / 2; 出力 2.5
6
x %= 2;  // x = x % 2; 出力 1
7
x **= 2;  // x = x ** 2; 出力 25
8
x ??= 2;  // 出力 5、xがnullまたはundefinedの場合は2を代入
9
console.log(x);

比較演算子

==：等価（型は自動変換される）
===：厳密等価（値と型の両方が等しい）
!=：不等価
!==：厳密不等価
>：大なり
<：小なり
>=：大なりイコール
<=：小なりイコール

非数値に遭遇した場合、まず数値に変換してから比較します。文字列に遭遇した場合、文字のUnicodeエンコーディングをビットごとに比較します。

例：

1
let a = 5;
2
let b = '5';
3
let c = 10;
4

5
console.log(a == b);   // 出力 true、値が等しい
6
console.log(a === b);  // 出力 false、型が等しくない
7
console.log(a != b);   // 出力 false、値が等しい
8
console.log(a !== b);  // 出力 true、型が等しくない
9
console.log(a > c);  // 出力 false、5 < 10
10
console.log(a < c);  // 出力 true、5 < 10
11
console.log(a >= c);  // 出力 false、5 <= 10
12
console.log(a <= c);  // 出力 true、5 <= 10

論理演算子

論理演算子はオペランドを処理する際、それらをブール値に変換し、そのオペランドの元の値を返します。

`&&`：論理AND

条件が同時に true かどうかを判断するために使用されます。すべての条件が true の場合、式全体の結果は true になります。それ以外の場合、結果は false です。 AND演算は左から右へ最初の false を探します。false が見つかると計算を停止し、このオペランドの元の値を返します（短絡評価）。最終的に false がなければ、最後の true を返します。

`||`：論理OR

少なくとも1つの条件が true かどうかを判断するために使用されます。少なくとも1つの条件が true の場合、式全体の結果は true になります。すべての条件が false の場合、結果は false です。 OR演算は左から右へ最初の true を探します。true が見つかると計算を停止し、このオペランドの元の値を返します（短絡評価）。最終的に true がなければ、最後の false を返します。

`!`：論理NOT

ブール値を反転するために使用されます。値が true の場合、論理NOT演算子を使用すると false に反転します。値が false の場合、true に反転します。論理NOTは非ブール値をブール値に変換するためにも使用できます。null、undefined、0、NaN、""（空文字列）以外の値は true に変換され、これらの値自体は false に変換されます。

例：

1
let a = true;
2
let b = false;
3
let c = "hello";
4
let d = null;
5

6
console.log(a && b);  // 出力 false
7
console.log(c && d);  // 出力 null
8
console.log(a || b);  // 出力 true
9
console.log(c || d);  // 出力 hello
10
console.log(!a);      // 出力 false
11
console.log(!d);      // 出力 true

三項演算子

condition ? expr1 : expr2：条件が真の場合は expr1 を返し、そうでなければ expr2 を返します。

例：

1
let age = 18;
2
let status = (age >= 18) ? '成人' : '未成年';
3
console.log(status);  // 出力 '成人'

null合体演算子

null合体演算子（Nullish Coalescing Operator）は、デフォルト値を処理するための演算子で、通常、変数が非null（null でも undefined でもない）の値を持つことを確保するために使用されます。この演算子の構文は ?? です。

null合体演算子を使用すると、最初に定義された（null でも undefined でもない）オペランドを返します。最初のオペランドが null または undefined の場合、2番目のオペランドを返します。

例：

1
let num1 = 0;
2
let num2 = 1;
3
let result = num1 ?? num2;
4
console.log(result);  // 出力 0、numがnullまたはundefinedではないため
5

6
let user;
7
console.log(user ?? "匿名"); // 出力 匿名、userが未定義のため

ビット演算子

&：ビットAND
|：ビットOR
^：ビットXOR
~：ビットNOT
<<：左シフト
>>：右シフト
>>>：符号なし右シフト

例：

1
let a = 5;  // 2進数：0101
2
let b = 3;  // 2進数：0011
3

4
console.log(a & b);   // 出力 1（ビットAND）
5
console.log(a | b);   // 出力 7（ビットOR）
6
console.log(a ^ b);   // 出力 6（ビットXOR）
7
console.log(~a);      // 出力 -6（ビットNOT）
8
console.log(a << 1);  // 出力 10（左シフト）
9
console.log(a >> 1);  // 出力 2（右シフト）

その他の演算子

typeof：評価されていないオペランドの型を示す文字列を返します。
instanceof：オブジェクトが指定された型のインスタンスかどうかをテストするために使用されます。

例：

1
let str = 'Hello';
2
console.log(typeof str);  // 出力 'string'
3

4
let arr = [1, 2, 3];
5
console.log(arr instanceof Array);  // 出力 true

`+`（プラス記号）

JavaScriptでは、プラス記号 + は数学演算、文字列連結、単項演算など、複数の用途があります。

数学演算

例：

1
let a = 5;
2
let b = 3;
3
let result = a + b;
4
console.log(result);  // 出力 8

両方が数値の場合、+ は数学的な加算を実行します。

文字列連結

例：

1
let str1 = 'Hello';
2
let str2 = ' World';
3
let result = str1 + str2;
4
console.log(result);  // 出力 'Hello World'

オペランドの1つが文字列の場合、+ は文字列連結を実行します。

単項プラス演算子

例：

1
let str = '42';
2
let num = +str;
3
console.log(num);  // 出力 42

単一のオペランドの前に + を使用すると、オペランドを数値に変換できます。これは単項プラス演算子の機能です。

型変換

例：

1
let num = 42;
2
let str = '10';
3
let result = num + str;  // 暗黙的型変換（型強制）
4
console.log(result);  // 出力 '4210'

オペランドの1つが文字列の場合、+ は型変換を行い、他のオペランドを文字列に変換してから文字列連結を実行します。

配列の連結

例：

1
let arr1 = [1, 2, 3];
2
let arr2 = [4, 5, 6];
3
let result = arr1 + arr2;
4
console.log(result);  // 出力 '1,2,34,5,6'

オペランドの1つが配列の場合、+ は配列を文字列に変換してから文字列連結を実行します。

特殊なケース

例：

1
let specialResult1 = '1' + 2 + 3;
2
console.log(specialResult1);  // 出力 '123'
3

4
let specialResult2 =  2 + 3 + '1';
5
console.log(specialResult2);  // 出力 '51'

specialResult1では、文字列が + の最も左に現れるため、後続の数値は文字列として連結されます。 specialResult2では、文字列が + の最も右に現れるため、前の数値は先に数学演算を行ってから連結されます。

`-`（マイナス記号）

JavaScriptでは、マイナス記号 - は数学的な減算を実行するための演算子です。

数学的減算

例：

1
let a = 5;
2
let b = 3;
3
let result = a - b;
4
console.log(result);  // 出力 2

両方が数値の場合、- は数学的な減算を実行します。

単項マイナス演算子

例：

1
let num = 42;
2
let result = -num;
3
console.log(result);  // 出力 -42

単一のオペランドの前に - を使用すると、単項否定を実行し、オペランドをその反対の数に変えます。

型変換

例：

1
let num1 = 42;
2
let str = '10';
3
let result = num1 - str;
4
console.log(result);  // 出力 32

オペランドの1つが文字列の場合、- は型変換を行い、他のオペランドを数値に変換してから数学的な減算を実行します。

特殊なケース

例：

1
let specialResult = '10' - 2;
2
console.log(specialResult);  // 出力 8

この特殊なケースでは、文字列の内容が正常に数値に変換できるため、- は数学的な減算を実行します。

`=、==、===`（代入、緩い等価、厳密等価）

JavaScriptでは、イコール記号 = は代入演算子であり、== と === は比較演算子です。緩い等価は両方のオペランドを同じ型に変換してから比較します。条件判断では、型変換を行わないため、通常 === が厳密等価比較に使用されます。

代入演算子

= は右側の値を左側の変数に代入するために使用されます。

例：

1
let x = 5;
2
let y = 'Hello';
3
console.log(x);  // 出力 5
4
console.log(y);  // 出力 'Hello'

この例では、= は右側の値を左側の変数 x と y に代入しています。

比較演算子

== と === は2つの値の等価性を比較するために使用されます。

例：

1
let a = 5;
2
let b = '5';
3

4
console.log(a == b);   // 出力 true
5
console.log(a === b);  // 出力 false

== は等価性を比較する際に型変換を行い、null == undefined は true を出力します。 === は等価性を比較する際に値と型の両方が等しいことを要求し、null === undefined は false を出力します。 NaN は NaN 自身を含むどの値とも等しくありません。

`++`、`--`（インクリメント、デクリメント）

JavaScriptでは、インクリメント（++）とデクリメント（--）は変数の値を増減するための演算子です。

インクリメント演算子 (++)

使用後、元の変数は直ちに1増加します。前置インクリメントはインクリメント後の値（新しい値）を返します。後置インクリメントはインクリメント前の値（古い値）を返します。

前置インクリメントの例：

1
let a = 5;
2
// 前置インクリメント、まず1増加し、次に新しい値を使用
3
let b = ++a;
4
console.log(b);  // 出力 6
5
console.log(a);  // 出力 6

この例では、a がまず1増加し、次に b が新しい a の値（6）を取得しました。

後置インクリメントの例：

1
let x = 5;
2
// 後置インクリメント、まず現在の値を使用し、次に1増加
3
let y = x++;
4
console.log(y);  // 出力 5
5
console.log(x);  // 出力 6

この例では、y がまず x の現在の値（5）を取得し、次に x が1増加しました。

デクリメント演算子 (—)

使用後、元の変数は直ちに1減少します。前置デクリメントはデクリメント後の値（新しい値）を返します。後置デクリメントはデクリメント前の値（古い値）を返します。

前置デクリメントの例：

1
let p = 10;
2
// 前置デクリメント、まず1減少し、次に新しい値を使用
3
let q = --p;
4
console.log(q);  // 出力 9
5
console.log(p);  // 出力 9

この例では、p がまず1減少し、次に q が新しい p の値（9）を取得しました。

後置デクリメントの例：

1
let m = 8;
2
// 後置デクリメント、まず現在の値を使用し、次に1減少
3
let n = m--;
4
console.log(n);  // 出力 8
5
console.log(m);  // 出力 7

この例では、n がまず m の現在の値（8）を取得し、次に m が1減少しました。

演算子の優先順位：

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Operator_precedence

算術演算子

代入演算子

比較演算子

論理演算子

&&：論理AND

||：論理OR

!：論理NOT

三項演算子

null合体演算子

ビット演算子

その他の演算子

+（プラス記号）

数学演算

文字列連結

単項プラス演算子

型変換

配列の連結

特殊なケース

-（マイナス記号）

数学的減算

単項マイナス演算子

型変換

特殊なケース

=、==、===（代入、緩い等価、厳密等価）

代入演算子

比較演算子

++、--（インクリメント、デクリメント）

インクリメント演算子 (++)

デクリメント演算子 (—)

演算子の優先順位：

コメント

`&&`：論理AND

`||`：論理OR

`!`：論理NOT

`+`（プラス記号）

`-`（マイナス記号）

`=、==、===`（代入、緩い等価、厳密等価）

`++`、`--`（インクリメント、デクリメント）