「比較演算子」は2つの値を比較して条件分岐などを行う処理によく使用されます。そのため、IF文やfor文・while文などのループ処理の条件式に使われることから使用することも多いと思います。この記事では、JavaScriptで用いられる比較演算子（= / < / > /!=）の意味や使い方について解説します。
比較演算子とは
比較演算子とは「==（等価）」「>=（以上）」などのことで、２つの値を比較するために用います。IF文やfor文・while文などのループ処理の条件式に使われることが多くて、文字通り2つの値を比較することが目的の演算子です。また、ただ値を比較するだけではなく、比較した結果を論理値（Boolean型）として返すことができます。論理値は「True / False」で返してくれるのが特徴です。
JavaScriptの比較において、一般的に利用されている演算子の一覧は次のとおりです。
| 比較演算子 | 意味 | 例 | 論理値 |
|---|---|---|---|
| > | 左辺が右辺より大きい | 5>4 | true |
| >= | 左辺が右辺以上 | 5>=4 | true |
| < | 左辺が右辺より小さい | 4<5 | true |
| <= | 左辺が右辺以下 | 4<=5 | true |
| == | 左辺が右辺の値が同じ | 5==5 | true |
| === | 左辺が右辺の値とデータ型が同じ | ‘5’===5 | false |
| !== | 右辺と左辺が異なる | ‘5’!===5 | false |
JavaScriptのIF文については、下記の記事で詳しく解説しています！
比較演算子の使い方
比較演算子の意味や種類が分かったところで、使い方について解説します。
より大きい(>)/より小さい(<)について
左辺が右辺より大きい（小さい）場合に 「true」 が、そうでない場合に 「false」 が返されます。
構文ルールは次のようになります。
(比較する値１) > (比較する値２)
(比較する値１) < (比較する値２)
実際のコードの記述は次のようになります。
var result1 = 20 > 10;
console.log( result1);
//実行結果は「true」となります
var result2 = 10 > 10;
console.log( result2);
//実行結果は「false」となります
以上(>=)/以下(<=)について
左辺が右辺より同じか大きい（小さい）場合に 「true」 が、そうでない場合に 「false」 が返されます。
構文ルールは次のようになります。
(比較する値１) >= (比較する値２)
(比較する値１) < =(比較する値２)
実際のコードの記述は次のようになります。
var result1 = 20 >= 10;
console.log( result1);
//実行結果は「true」となります
var result2 = 10 >= 10;
console.log( result2);
//実行結果は「true」となります
var result3 = 5 >= 10;
console.log( result3);
//実行結果は「false」となります
等価(==)について
左辺と右辺の値が等しい場合に 「true」 が、そうでない場合に 「false」 が返されます。
構文ルールは次のようになります。
(比較する値１) == (比較する値２)
実際のコードの記述は次のようになります。
var result1 = 10 == 10;
console.log( result1);
//実行結果は「true」となります
var result2 = 20 == 10;
console.log( result2);
//実行結果は「false」となります
ちなみに、なぜ “=” を２つ続ける理由は”=” １つでは代入の意味になるためです。「A = B」としてしまうと、Bの値をAに代入する処理になってしまいますので、注意しましょう。
不等価(!=)について
等価演算子の逆です。左辺と右辺の値が等しい場合に 「false」 が、そうでない場合に 「true」 が返されます。
構文ルールは次のようになります。
(比較する値１) != (比較する値２)
実際のコードの記述は次のようになります。
var result1 = 5 != 10;
console.log( result1);
//実行結果は「true」となります
var result2 = 10 != 10;
console.log( result2);
//実行結果は「false」となります
厳密等価演算子(===)について
厳密等価演算子は、２つの値に加えて２つの値のデータ型まで比較します。
左辺と右辺の値とデータ型が等しい場合に 「true」 が、そうでない場合に 「false」 が返されます。
構文ルールは次のようになります。
(比較する値１) === (比較する値２)
実際のコードの記述は次のようになります。
var result1 = 10 === 10;
console.log( result1);
//実行結果は「true」となります
var result1 = 5 === 10;
console.log( result1);
//実行結果は「false」となります
var result3 = 10 === ‘10’;
console.log( result3);
//実行結果は「false」となります
3つめの例では「10」は数字、「’10’」は文字列のデータ型となっているため「false」が返されています。単純な等価演算子（==）であれば、値だけを比較するため結果は 「true」 となりますが、厳密等価演算子（===）は、２つの変数のデータ型も一致しているかどうかを比較します。
厳密不等価演算子(!==)について
等価演算子と反対の結果を返します。左辺と右辺の値とデータ型が等しい場合に 「false」 が、そうでない場合に 「true」 が返されます。
構文ルールは次のようになります。
(比較する値１) !== (比較する値２)
実際のコードの記述は次のようになります。
var result1 = 10 === 10;
console.log( result1);
//実行結果は「false」となります
var result1 = 5 === 10;
console.log( result1);
//実行結果は「true」となります
var result3 = 10 === ‘10’;
console.log( result3);
//実行結果は「true」となります
まとめ
この記事では、JavaScriptで用いられる比較演算子（= / < / > /!=）の意味や使い方について解説しました。比較演算子はIF文やfor文・while文などのループ処理の条件式に使われることから使用することも多いです。ぜひ自分のプログラムにも取り入れながら積極的に活用してください。この記事を参考にJavaScriptの比較演算子を習得していただければと思います。
JavaScriptを短期間かつ効率的に学びたい方は
「独学だと分からないことが多すぎる」「プログラミングをより現場に近い形で学びたい」「学んだ後にどう収益に繋げればいいの？」と考えている方も多いでしょう。
そんな方には、現役エンジニア講師在籍/案件獲得サポートもあるプログラミングスクールで学ぶのがおすすめです。都度検索しながら知識を補完していくのではなく、体系立てて学ぶことで短期間かつ効率的にプログラミングを習得することが可能です。
「即戦力になれる！稼いでいけるようになれる！」プログラミングスクールを紹介した記事をこちらに記載しておきますので、是非ご覧ください。
コメント