javascript 広告

PHPとjavascriptのイコール判定、イコール2つとイコール3つ、何が違う?

PHPとjavascriptのイコール判定、イコール2つとイコール3つ、何が違う?
記事内に商品プロモーションを含む場合があります

PHPやJavascriptでは等しいという条件判定でイコールを2つ書く書き方(==)とイコールを3つ書く書き方(===)があります。

この2つの書き方は全く同じではなく、意味があって分かれています。

イコール3つという判定文の書き方は他の言語ではあまり見ないものであるため、知らずにイコール2つだけの判定文を使ってしまうと予想外の動作になりかねません。

そこで、今回はイコール2つの書き方とイコール3つの書き方でどんな違いが起こるのかを見ていきます。

ソースはjavascriptで書きますが、PHPも同じような意味合いになるため、PHPのコードを書く方も意識して見て欲しい内容です。

今回使用するソース

今回は以下のようなソースを使用します。

<!DOCTYPE html>
<html>
    <head>

    </head>
    <body>
        <input type="text" id="number" onchange="isZeroEq1();"/>
    </body>
    <script type="text/javascript">
        //イコール2つの判定
        function isZeroEq1(){
            //テキストボックスの値を取得
            var value = document.getElementById("number").value;
            //入力の値が0に等しいかの判定
            if (value  == 0) {
                //入力が等しければ等しいと出力
                console.log("等しい");
            } else {
                //入力が等しくなければ等しくないと出力
                console.log("等しくない");
            }
        };

        //イコール3つの判定
        function isZeroEq2(){
            //テキストボックスの値を取得
            var value = document.getElementById("number").value;
            //入力の値が0に等しいかの判定
            if (value  === 0) {
                //入力が等しければ等しいと出力
                console.log("等しい");
            } else {
                //入力が等しくなければ等しくないと出力
                console.log("等しくない");
            }
        };

        //イコール3つの判定(入力と比較対象の型を合わせたもの)
        function isZeroEq3(){
            //テキストボックスの値を取得
            var value = document.getElementById("number").value;
            //入力の値が0に等しいかの判定
            if (value  === '0') {
                //入力が等しければ等しいと出力
                console.log("等しい");
            } else {
                //入力が等しくなければ等しくないと出力
                console.log("等しくない");
            }
        };

    </script>
</html>

このソースは、isZeroEq1ではテキストボックスの値をイコール2つ(==)で数値の0と比較する処理、isZeroEq2ではテキストボックスの値をイコール3つ(===)で数値の0と比較する処理、isZeroEq3ではイコール3つ(===)で文字列の”0″と比較する処理となっています。

イコール2つで数値の0とテキスト朴素の入力値を比較する場合

では、まず最初にイコール2つで数値と比較する動作を見てみましょう。

上記ソースではイコール2つで数値の0と比較するisZeroEq1をテキストボックスの値を更新した後に呼び出していますので、ソースをそのままにして実行してみます。

5を入力した場合

5と0は等しくないため、

if (value  == 0) {

のvalueと0が等しいと判定されず、コンソールに「等しくない」と表示されています。

これは正しそうです。

0入力した場合

0を入力した場合は、0と等しいため、

if (value  == 0) {

の値が等しいと判断され、コンソールに等しいと表示されています。

この処理で一見大丈夫そうです。

イコール3つで数値の0とテキストボックスの入力値を比較する場合

では、次にテキストボックスのonchange関数を呼び出す先を以下のように変えて同じようにテキストボックスに5と0を入力してみます。

<input type="text" id="number" onchange="isZeroEq2();"/>

こうすることで、javaScriptのイコール3つで判定するisZeroEq2()の関数を呼び出すようになります。

5を入力した場合

5を入力すると5と0は等しくないので等しくないと出力されました。

0を入力した場合


0を入力すると
if (value  === 0) {

で、valueは0が入っているはずなのに等しくないと表示されています。

・・・これはどういうことでしょうか?

デバッグでこの判定文の前で止めて値を見ることにします。

valueに入っているのは文字列の”0″。

つまり、数値の0と文字列の”0″は型が一致しないため、一致しないと判定されたわけです。

イコール3つで文字列の”0”とテキストボックスの入力値を比較する場合

では、文字列同士の比較に変更した、isZeroEq3を呼び出すとどうでしょうか?

テキストボックスのonchange関数をisZeroEq3を呼び出すようにして再度実行してみます。

<input type="text" id="number" onchange="isZeroEq3();"/>

このように書き換えることで、入力値と文字列の”0”を比較するisZeroEq3を呼び出します。

5を入力した場合

“5”と”0″は等しくないため、等しくないと表示されます。

0を入力した場合

こちらの処理では、”0″と”0″が等しいかの判定となり、正しく等しいと判定されました。

イコール2つとイコール3つのどちらを使うべきか?

今回使ったプログラムではイコール2つとイコール3つはどちらも問題なく判定が出来ていました。

しかし、イコール2つの場合、比較する値の型を合わせて比較するという比較の方法となっています。

そのため、プログラムの書き方によってはイコール2つを使ったことにより想定しない動きになることがあります。

ですので、イコール3つの書き方を自分は開発の現場でも意識して使うようにしています。

イコール2つの書き方で問題がない場合もありますが、型を意識したイコール3つの方を使う。

型を意識した条件判定のコードを書くと、予測しないバグが生まれず、問題個所があっても原因特定がしやすくなります。

ですので、なるべくイコール3つの条件判定を使い、型変換をプログラムに任せるのではなく、コードを書く時にしっかりと意識してやって欲しいと思います。


ソースはjavascriptで書きましたが、PHPも同じようにイコール2つの書き方とイコール3つの書き方があり、javascriptと同様の判定となります。

ですので、PHPにおいてもイコール3つの書き方をするようにしっかりと意識してください。

今回の記事はここまでとなります。
また次回の記事でお会いしましょう。