見出し画像

【Javascript】条件演算子はややこしい!?数学の記号と関連付けて覚えよう。


プログラミングの演算子ってたくさんありますよね。
このNoteでは、Javascriptの演算子について説明します。

演算子の勉強をしてて思うのですが、

数学の記号と

「ものすごく似ている」

と思います。なので、

「数学の記号と比較」

を交えながら

紹介していきたいと思います。

ここでは比較演算子を取り上げていきますが、

まず、比較演算子で

「数値や文字列」

を比べることによって、どのような値を返すのかみてから

比較演算子の紹介にうつりたいと思います。

※数値や文字を比較演算子で比べた結果やどのような値で「true,false」になるのかわかっている場合は、等値演算子まで読み飛ばしても構いません。

そもそも数値や文字列を比較演算子で比べた結果の値はどうなってるの?

比較演算子により、比べられたものは

「true,false」

となって、返ってきます。

「true,false」は真偽型(Boolean型)

ですが、そもそもどういう基準で

「true,false」

が決まるのでしょうか?

法則を次の項目に書きます。

↓  ↓  ↓

①<,>,<=...など、比べた結果が正しいときは「true」
②null,0,undefined,''(空の文字列)は「false」

となります。

それでは、一つずつ比較する演算子を見ていきましょう。

※nullとundefinedは厳密には違いがありますが、ここでは説明しません。

等値演算子

等値演算子の「等値」とは

「等しい値」

のことです。つまり、

「数字・文字が同じかどうか」

を比較します。

比較した結果、

「正しければ」・・・true
「間違っていれば」・・・false

となります。

1)A==B

意味は

「AとBは等しい」

という意味になります。

※数学の記号では「=」で表します。プログラミングでは

「=」は代入を示す

ので要注意です!!

2)A!=B

意味は

「AとBは等しくない」

という意味になります。

数学の記号で

「≠」

と表します。

一見、

「別々に覚えなければいけない」

と思われがちですが、
こういうふうにイメージすると

↓  ↓  ↓

タイトルなし

「≠」に見えてきませんか?

こう覚えておくと、関連付けられて覚えやすいのかなと思います。

3)===と!==

こちらは

「型の一致以外」

「==と!=」

と同じです。

「===と==の違い」

に関しては以下のNoteをチェックしてみてください。

比較演算子

比較演算子とはズバリ!

「比べる演算子」

のことです。ここは数学の記号と

「共通点が多い」

ように感じられます。

比較演算子も

比較した結果、

「正しければ」・・・True。
「間違っていれば」・・・False。

なります。

たとえば、

「<(小なり)」、「>(大なり)」

「数学の記号と同じ」

です。

意味を解説しておくと、

A<B:AはBより小さい(AはBを含まず大きいかどうか)
A>B:AはBより大きい
(AはBを含まず小さいかどうか)

という意味になります。ですが、

〇〇以上
とか
〇〇以下

はどう表せればいいのでしょうか。

答えは

>=:以上
<=:以下

となります。数学の記号とは全く違いますよね。

A>=B:AはB以上ある。(AはBを含んで大きいかどうか)
A<=B:AはB以下である。(AはBを含んで小さいかどうか)

ちなみに、数学の記号では

≧:以上
≦:以下

と表します。

ですが、

「≧」

をよーくみてください。

タイトルなし

こういうふうに、

「=と>を分解」

すれば、

>=:以上
<=:以下

でも納得がいきませんか?

※ちなみに、Javascript(EcmaScript6)ではおなじみの

アロー関数(()=>)

と混同しないように気をつけましょう。なお、関数について知りたい方は以下の記事が詳しいです。

論理演算子(&&,||,!)

「&&」と「||」、「!」はどういうときに使うのでしょうか。
それは、

[Aの条件] && [Bの条件](AかつB):Aの条件もBの条件も満たしているとき
[Aの条件] || [Bの条件](AまたはB):Aの条件、Bの条件のうちいずれかが満たされているとき

![Aの条件] Aの条件ではないとき。

に使われます。

「&&」の使用例
たとえば、10から30までの範囲を表すとき
数学では

10<x<30

と書きます。

ですが、プログラミング演算子を使って書くと、

10<x && x<30

となります。

なぜそうなるのかというと、

まず、&&で結ばれた

・10<x・・・10はxより小さい
・x<30・・・xは30より小さい

をそれぞれ比較します。
その上で、

[Aの条件]&&[Bの条件](AかつB)

「Aの条件」も「Bの条件」もあっていると、

true

で返します。よって

10<x && x<30

の意味は

変数xが10から30以内であるか

という意味になります。

数学の書き方を覚えておくと、

「範囲を整理」

できるので、

プログラミングする際にも

「優位に」

働きます。

またもう一つ具体例をあげるならば、

if([条件式A]){
 if([条件式B]){}
}

ようなコードがあった時、「&&」を使えば

if([条件式A] && [条件式B]){

 ...<処理>

}

のように書くこともできます。

まとめ

いかがでしたでしょうか?今回は

①等値演算子・・・値同士が等しい(=)であるかどうか
②比較演算子・・・文字通り値同士を比べる。
③論理演算子・・・&&(かつ)、||(または)。!(ではない)、&&は変数の範囲にも使える!!

を数学の記号と交えながら教えました。

みなさんの

「プログラミング学習」

になれればうれしいです。

それでは、また次のNoteにてお会いしましょう。ここまで読んでいただきありがとうございました。

<参考文献>


この記事が気に入ったらサポートをしてみませんか?