JavaScript 比較演算子

概要: このチュートリアルでは、JavaScript 比較演算子を使用して 2 つの値を比較する方法について説明します。

JavaScript 比較演算子の導入

2 つの値を比較するには、比較演算子を使用します。JavaScript の比較演算子は以下の表に示されています。

比較演算子は、比較が真か偽かを示す Boolean 値を返します。以下の例を参照してください。

let r1 = 20 > 10; // true
let r2 = 20 < 10; // false
let r3 = 10 == 10; // trueCode language: JavaScript (javascript)

比較演算子は 2 つの値を受け取ります。値の型が比較可能でない場合、比較演算子は特定のルールに従ってそれらを比較可能な型の値に変換します。

数値を比較します。

値が数値の場合、比較演算子は数値比較を実行します。例:

let a = 10, 
    b = 20; 

console.log(a >= b);  // false
console.log(a == 10); // trueCode language: JavaScript (javascript)

この例は単純です。変数 a は 10、b は 20 です。式 a >= b の式は false を返し、 a == 10 の式は true を返します。

文字列の比較

オペランドが文字列の場合、JavaScript は文字列内の文字コードを数値的に 1 つずつ比較します。

let name1 = 'alice',
    name2 = 'bob';    

let result = name1 < name2;
console.log(result); // true
console.log(name1 == 'alice'); // trueCode language: JavaScript (javascript)

JavaScript は数値的に文字列内の文字コードを比較するため、次のような予期しない結果が生じる場合があります。

let f1 = 'apple',
    f2 = 'Banana';
let result = f2 < f1;
console.log(result); // trueCode language: JavaScript (javascript)

この例では、文字 B の文字コードが 66 であり、文字 a の文字コードが 97 であるため、f2 は f1 より小さくなります。

これを修正するには、以下を行う必要があります。

• まず、文字列を小文字または大文字という共通の形式に変換します。
• 次に、変換された値を比較します。

例:

let f1 = 'apple',
    f2 = 'Banana';

let result = f2.toLowerCase() < f1.toLowerCase();
console.log(result); // falseCode language: JavaScript (javascript)

toLowerCase() は文字列を小文字に変換する String オブジェクトのメソッドです。

数値を別の型の値と比較する

1 つの値が数値で、もう 1 つが数値でない場合、比較演算子は数値でない値を数値に変換して数値的に比較します。例:

console.log(10 < '20'); // trueCode language: JavaScript (javascript)

この例では、比較演算子は文字列 '20' を数値 20 に変換して、数値 10 と比較します。例を次に示します。

console.log(10 == '10'); // trueCode language: JavaScript (javascript)

この例では、比較演算子は文字列 '10' を数値 10 に変換し、数値的に比較します。

オブジェクトとオブジェクト以外のオブジェクトを比較する

値がオブジェクトの場合、そのオブジェクトの valueOf() メソッドが呼び出されて比較用の値が返されます。オブジェクトに valueOf() メソッドがない場合、代わりに toString() メソッドが呼び出されます。例:

let apple = {
  valueOf: function () {
    return 10;
  },
};

let orange = {
  toString: function () {
    return '20';
  },
};
console.log(apple > 10); // false
console.log(orange == 20); // true
Code language: JavaScript (javascript)

この最初の比較では、apple オブジェクトは 10 を返す valueOf() メソッドを持っています。したがって、比較演算子は数値 10 を比較に使用します。

2 番目の比較では、JavaScript は最初に valueOf() メソッドを呼び出します。ただし、orange オブジェクトには valueOf() メソッドがありません。そのため、JavaScript は toString() メソッドを呼び出して比較用の戻り値 20 を取得します。

ブール値を別の値と比較する

値がブール値の場合、JavaScript はそれを数値に変換し、変換後の値を他の値と比較します。true は 1 に変換され、false は 0 に変換されます。たとえば

console.log(true > 0); // true
console.log(false < 1); // true
console.log(true > false); // true
console.log(false > true); // false
console.log(true >= true); // true
console.log(true <= true); // true
console.log(false <= false); // true
console.log(false >= false); // trueCode language: JavaScript (javascript)

上記の規則に加えて、等しい (==) 演算子と等しくない (!=) 演算子にも次の規則があります。

null と undefined を比較します。

JavaScript では、null は undefined に等しくなります。つまり、次の式は true を返します。

console.log(null == undefined); // trueCode language: JavaScript (javascript)

NaN を他の値と比較します

どちらの値も NaN である場合、等しい演算子 (==) は false を返します。

console.log(NaN == 1); // falseCode language: JavaScript (javascript)

ただし

console.log(NaN == NaN); // falseCode language: JavaScript (javascript)

等しくない (!=) 演算子は、NaN と他の値を比較するときに true を返します。

console.log(NaN != 1); // trueCode language: JavaScript (javascript)

また

console.log(NaN != NaN); // trueCode language: JavaScript (javascript)

厳密に等しい (===) と厳密に等しくない (!==)

上記の比較演算子に加えて、JavaScript は厳密に等しい (===) と厳密に等しくない（ ！==）演算子を提供します。

厳密に等しい演算子と厳密に等しくない演算子は、オペランドを比較する前に変換しないという点を除いて、等しい演算子と等しくない演算子と同じように動作します。次の例を参照してください。

console.log("10" == 10); // true
console.log("10" === 10); // falseCode language: JavaScript (javascript)

最初の比較では、等号演算子を使用するため、JavaScript は文字列を数値に変換して比較を実行します。

ただし、2 番目の比較では厳密に等しい演算子 (===) を使用します。JavaScript は比較前に文字列を変換しないため、結果は false になります。

このチュートリアルでは、JavaScript の比較演算子を使用して値を比較する方法を学びました。