等価演算子

広告

JavaScript で用意されている演算子の中で、 2 つの値が等しいか等しくないかを調べる時に使用す等価演算子の種類と使い方について解説します。等価演算子では値とデータ型の両方が同じかどうかを調べる厳密等価演算子ものと、値だけが同じかどうかを調べる等価演算子の二種類が用意されています。

等価演算子の種類と使い方

等価演算子には次の 4 種類が用意されています。

==   等価
!=   不等価
===  厳密等価
!==  厳密不等価

等価演算子は 2 つの値が等しいか(または等しくないか)を評価し true または false を返します。等価演算子は if 文や for 文などの条件式を記述するところで利用されることが多いです。

次のサンプルをみてください。

let hobby = '映画';

if (hobby == '映画'){
  console.log('映画をみにいきましょう');
}else{
  console.log('散歩にいきましょう');
}

>> 映画をみにいきましょう

上記では条件式として hobby == '映画' と記述されており、等価演算子のひとつである == が使用されています。等価演算子は演算子の前および後の値を比較し true か false を返します。今回は変数 hobby に格納されている値が '映画' ですので件式は true となり、 if 文のブロックの中の処理が実行されました。

2 つの値が等しいか(または等しくないか)について、 JavaScript では 2 種類の演算子 == と === がそれぞれ用意されています。このあとで順に解説しますが、等価演算子は値が等しいかどうかをチェックし、厳密等価演算子は値に加えてデータ型が等しいかどうかをチェックします。なお値がオブジェクトだった場合には、どちらの演算子も同じオブジェクトを参照している場合のみ true となります。

等価演算子(==)、不等価演算子(!=)

等価演算子では、比較する 2 つの値が同じ値だった場合に true となります。 2 つの値のデータ型が異なる場合は同じ型になるように変換された後で比較されます。また値がオブジェクト型だった場合は、 2 つの値が同じオブジェクトを参照している場合に true となります。

※ 不等価演算子は等価演算子とまったく逆の結果が出ます。

最初に値がプリミティブ型で同じデータ型の場合のサンプルです。

console.log(10 == 10);
>> true
console.log(10 == 8);
>> false
console.log('Apple' == 'Apple');
>> true
console.log('Apple' == 'apple');
>> false
console.log(true == true);
>> true
console.log(true == false);
>> false
console.log(null == null);
>> true
console.log(undefined == undefined);
>> true
console.log(NaN == NaN);
>> false

同じデータ型の比較の場合、値が同じであれば true となりますが NaN だけはいずれの場合も false となります。

2 つの値のデータ型が数値と文字列だった場合、文字列を数値に変換したあとで比較が行われます。

console.log(10 == '10');
>> true

console.log(10 == '8');
>> false

console.log(10 == 'Apple');
>> false

2 つの値のデータ型が数値と論理値だった場合、 true は 1 に false は 0 に変換したあとで比較が行われます。 2 つの値のデータ型が文字列と論理値だった場合、どちらも数値に変換されたあとで比較がされます。

console.log(1 == true);
>> true
console.log(0 == false);
>> true
console.log(1 == false);
>> false
console.log('1' == true);
>> true
console.log('true' == true);
>> false

null と undefined とを比較すると true となります。 null や undefined は数値や文字列と比較すると false となります。

console.log(null == undefined);
>> true

console.log(null == 0);
>> false

console.log(null == 1);
>> false

続いて値がオブジェクト型だった場合です。オブジェクト型の場合は 2 つの値が同じオブジェクトを参照している場合だけ true となります。次のサンプルをみてください。

let obj1 = {red:'赤', blue:'青'};
let obj2 = {red:'赤', blue:'青'};
let obj3;

obj3 = obj1;

console.log(obj1 == obj2);
>> false

console.log(obj1 == obj3);
>> true

obj1 と obj2 はプロパティの構成はまったく同じですが、別々のオブジェクトのため等価演算子で比較すると false となります。 obj3 は obj1 を代入しており、 2 つの変数は同じオブジェクトを参照しているため等価演算子で比較すると true となります。

2 つの値のひとつがプリミティブ型でもうひとつがオブジェクト型だった場合には、オブジェクト型の値を数値または文字列に変換したあとで比較が行われます。

console.log(10 == [10]);
>> true
console.log(10 == [10, 20]);
>> false
console.log(10 == ['10']);
>> true
console.log(10 == {num:'10'});
>> false
console.log(10 == new Number(10));
>> true

厳密等価演算子(===)、厳密不等価演算子(!==)

厳密等価演算子では、比較する 2 つの値が同じデータ型で同じ値だった場合に true となります。 2 つの値のデータ型が異なる場合は常に false となります。また値がオブジェクト型だった場合は、 2 つの値が同じオブジェクトを参照している場合に true となります。

※ 厳密不等価演算子は厳密等価演算子とまったく逆の結果が出ます。

最初に値がプリミティブ型で同じデータ型の場合のサンプルです。データ型が同じ場合は等価演算子と同じ結果となります。

console.log(10 === 10);
>> true
console.log(10 === 8);
>> false
console.log('Apple' === 'Apple');
>> true
console.log('Apple' === 'apple');
>> false
console.log(true === true);
>> true
console.log(true === false);
>> false
console.log(null === null);
>> true
console.log(undefined === undefined);
>> true
console.log(NaN === NaN);
>> false

等価演算子の場合と同じく NaN だけはいずれの場合も false となります。

2 つの値のデータ型が異なる場合はすべて false となります。

console.log(10 === '10');
>> false
console.log(1 === true);
>> false
console.log(0 === false);
>> false
console.log(null === undefined);
>> false
console.log(null === 0);
>> false
console.log(10 === [10]);
>> false
console.log(10 === new Number(10));
>> false

2 つの値が共にオブジェクト型の場合、 2 つの値が同じオブジェクトを参照している場合だけ true となります。次のサンプルをみてください。

let obj1 = {red:'赤', blue:'青'};
let obj2 = {red:'赤', blue:'青'};
let obj3;

obj3 = obj1;

console.log(obj1 === obj2);
>> false

console.log(obj1 === obj3);
>> true

obj1 と obj2 はプロパティの構成はまったく同じですが、別々のオブジェクトのため厳密等価演算子で比較すると false となります。 obj3 は obj1 を代入しており、 2 つの変数は同じオブジェクトを参照しているため厳密等価演算子で比較すると true となります。

このように等価演算子と厳密等価演算子では結果が異なる場合があるので、どのような比較を必要とするかにあわせてどちらの演算子を使用するのかを検討する必要があります。

-- --

JavaScript で用意されている演算子の中で、 2 つの値が等しいか等しくないかを調べる時に使用す等価演算子の種類と使い方について解説しました。

( Written by Tatsuo Ikura )

関連記事 (一部広告含む)
Profile
profile_img

著者 / TATSUO IKURA

初心者~中級者の方を対象としたプログラミング方法や開発環境の構築の解説を行うサイトの運営を行っています。