undefinedやnullなどの一致判定について

JavaScriptにおける等価(==)演算子や論理否定(!)演算子でのundefined/null/false/空文字('')の判定結果についてまとめてみました。まとめたというか実行結果ですね(笑)。
特に論理否定演算子の判定でどれが使えるか覚えてないので・・・

ぞれぞれ右側のコメントがconsole.log()の実行結果です。当然ですが厳密等価(===)演算子の場合は変数の値が完全に一致しなければ結果はfalseになります。
覚えれないなら、厳密等価演算子使えってことですね。(^-^;

undefined

nullとの比較でも一致します。

const valueUndefined = undefined;
console.log(valueUndefined ? 'true' : 'false');     // 'false'
console.log(!valueUndefined);                       // true
console.log(valueUndefined == undefined);           // true
console.log(valueUndefined === undefined);          // true
console.log(valueUndefined == null);                // true
console.log(valueUndefined === null);               // false
console.log(valueUndefined == false);               // false
console.log(valueUndefined === false);              // false
console.log(valueUndefined == '');                  // false
console.log(valueUndefined === '');                 // false
console.log(valueUndefined == 0);                   // false
console.log(valueUndefined === 0);                  // false

null

undefinedとの比較でも一致します。

const valueNull = null;
console.log(valueNull ? 'true' : 'false');          // 'false'
console.log(!valueNull);                            // true
console.log(valueNull == undefined);                // true
console.log(valueNull === undefined);               // false
console.log(valueNull == null);                     // true
console.log(valueNull === null);                    // true
console.log(valueNull == false);                    // false
console.log(valueNull === false);                   // false
console.log(valueNull == '');                       // false
console.log(valueNull === '');                      // false
console.log(valueNull == 0);                        // false
console.log(valueNull === 0);                       // false

false

空文字('')、0との比較でも一致します。

const valueFalse = false;
console.log(valueFalse ? 'true' : 'false');         // 'false'
console.log(!valueFalse);                           // true
console.log(valueFalse == undefined);               // false
console.log(valueFalse === undefined);              // false
console.log(valueFalse == null);                    // false
console.log(valueFalse === null);                   // false
console.log(valueFalse == false);                   // true
console.log(valueFalse === false);                  // true
console.log(valueFalse == '');                      // true
console.log(valueFalse === '');                     // false
console.log(valueFalse == 0);                       // true
console.log(valueFalse === 0);                      // false

空文字

false0との比較でも一致します。

const valueEmpty = "";
console.log(valueEmpty ? 'true' : 'false');         // 'false'
console.log(!valueEmpty);                           // true
console.log(valueEmpty == undefined);               // false
console.log(valueEmpty === undefined);              // false
console.log(valueEmpty == null);                    // false
console.log(valueEmpty === null);                   // false
console.log(valueEmpty == false);                   // true
console.log(valueEmpty === false);                  // false
console.log(valueEmpty == '');                      // true
console.log(valueEmpty === '');                     // true
console.log(valueEmpty == 0);                       // true
console.log(valueEmpty === 0);                      // false

0

false、空文字('')との比較でも一致します。

const valueZero = 0;
console.log(valueZero ? 'true' : 'false');          // 'false'
console.log(!valueZero);                            // true
console.log(valueZero == undefined);                // false
console.log(valueZero === undefined);               // false
console.log(valueZero == null);                     // false
console.log(valueZero === null);                    // false
console.log(valueZero == false);                    // true
console.log(valueZero === false);                   // false
console.log(valueZero == '');                       // true
console.log(valueZero === '');                      // false
console.log(valueZero == 0);                        // true
console.log(valueZero === 0);                       // true

オブジェクトのプロパティ

プロパティがあるかどうかを確認するにはin演算子を使います。
等価演算子や厳密等価子はプロパティがあるかどうかの確認には使えません。存在しないプロパティの判定結果が、存在するプロパティの値がundefinedの場合と同じになるためです。

const object = {
    exist: undefined,
};
// 存在しないプロパティ.
console.log(object.notExist ? 'true' : 'false');    // 'false'
console.log(!object.notExist);                      // true
console.log(object.notExist == undefined);          // true
console.log(object.notExist === undefined);         // true
console.log(object.notExist == null);               // true
console.log(object.notExist === null);              // false
console.log(object.notExist == false);              // false
console.log(object.notExist === false);             // false
console.log(object.notExist == '');                 // false
console.log(object.notExist === '');                // false
console.log('notExist' in object);                  // false

// 存在するプロパティ.
console.log(object.exist == undefined);             // true
console.log(object.exist === undefined);            // true
console.log(object.exist ? 'true' : 'false');       // 'false'
console.log('exist' in object);                     // true

存在するプロパティの場合は、値の判定になるので各演算子の判定結果は変数の場合と同じになります。

このエントリーをはてなブックマークに追加
にほんブログ村 IT技術ブログへ

コメント

メールアドレスが公開されることはありません。 が付いている欄は必須項目です