JavaScriptでundefined値かどうか判定する方法を解説!
JavaScriptでundefined値かどうか判定する方法をサンプルコード付きで解説していきます。typeof演算子やvoid 0を使った方法など複数紹介します。
JavaScriptでundefined値かどうか判定したい
JavaScriptで変数がすでに定義されているかチェックをしたい時があります。
JavaScriptでは初期化されていない変数に対してはundefined
という値がセットされています。つまり変数が初期化されているかどうかの判定はundefined
かどうかを判定することで行なえます。
一方で変数がundefined
値かどうかの判定の仕方は何パターンかあり、この記事ではJavaScriptでundefined
値かどうか判定する方法を順番に解説していきます。
JavaScriptでundefined値かどうか判定する方法
JavaScriptでundefined
値かどうか判定する方法ですが、いくつかやり方があります。順番に紹介していきますので、ぜひやりやすいやり方を採用してみて下さい。
typeof演算子を利用する方法
対象となるデータ型を表すtypeof
演算子を使ってundefined
値かどうかの判定をします。
typeof演算子を利用したundefined値の判定
if( typeof tmp === 'undefined'){
console.log("true");
}else{
console.log("false");
}
上記コードの結果はtrue
となります。tmp
は未定義で、typeof tmp
は文字列のundefined
を返します。またこの後の例とは違いtmp
が未登場の場合でもtypeof
演算子を使うとエラーにならずに処理が続きます。(存在チェックとしても使えます)
このようにtypeof
演算子を利用すればundefined
値の判定が行なえます。
void 0と比較して判定する
void 0
はJavaScriptではundefined
を返します。(0以外でもundefined
が返りますが)
この性質を利用して、void 0
とundefined
値と比較を行い判定します。
if文にそのまま判定をさせる
var tmp;
if (tmp === void 0) {
console.log("true");
}else{
console.log("false");
}
上記の結果はtrue
が返ります。
undefinedを自ら定義する書き方
undefined
は予約後ではないため、そのまま使うことはできませんが、下記のように即時関数の引数に持ってくることで定義されている状態で判定に利用出来ます。
undefinedを自ら定義する書き方
(function(undefined){
var tmp;
if (tmp === undefined) {
console.log("true");
}else{
console.log("false");
}
})();
上記の結果もtrue
となります。void 0
やtypeof
演算子を使わずにundefined
でそのまま比較が出来るため人によっては分かりやすい形になるかと思います。
【非推奨】if分にそのまま判定を任せる
undefined
値をそのままif文の条件式に入れるとfalse
が返ってきます。それを利用してundefined
値の判定をif文に任せるやり方です。
if文に判定を任せる
var tmp;
if (!tmp) {
console.log("true");
}else{
console.log("false");
}
上記の結果もtrue
を返します。
ただしこのやり方には注意点があります。今はサンプルコードとしてtmp
の正体がわかっていますが、実際に使う時には他の値が入る場合もあります。特にfalse
や0
などが入ってきた時はこのサンプルコードでは同様にtrue
を返します。
つまり厳密なundefined
値の判定ではないので注意しましょう。
【非推奨】nullとの比較で判定させる
次にJavaScriptのnull
との比較でundefined
値を判定する方法です。厳密にはundefined
値とnull
は異なりますが、厳密ではない比較の==
を使うことでundefined
値を判定出来ます。
nullとの比較で判定させる
var tmp;
if (tmp == null) {
console.log("true");
}else{
console.log("false");
}
上記の結果はtrue
になります。ただし==
を===
と3つにすると厳密な比較となり、false
になります。
コーディングの規約で==
を禁止しているところや、厳密に判定したい方にとっては非推奨のやり方です。
またundefinedとnullの違いがいまいち理解できない方はぜひ下記を参考にしてみましょう。
まとめ
JavaScriptでundefined
値を判定する方法を紹介してきました。数的にはtypeof
演算子のやり方が多いですが、jQueryだとundefined
を自ら定義する書き方で書かれていたりとか、プロジェクトによってはバラバラです。
ぜひ一番自身がやりやすいやり方を採用してみて下さい。また会社やプロジェクトですでにルールがある場合はそれに従うようにしましょう。
