web-dev-qa-db-ja.com

JavaScriptで未定義変数またはnull変数を確認する方法

私たちはJavaScriptコードで以下のコードパターンを頻繁に使用しています。

if (typeof(some_variable) != 'undefined' && some_variable != null)
{
    // Do something with some_variable
}

同じ効果を持つ、より冗長性の低いチェック方法はありますか？

いくつかのフォーラムや文献によると、単に次のようにしても同じ効果があるはずです。

if (some_variable)
{
    // Do something with some_variable
}

残念ながら、 Firebug は、some_variableが未定義の場合、実行時にエラーとしてそのようなステートメントを評価しますが、最初のステートメントではそれで問題ありません。これはFirebugの（望ましくない）振る舞いにすぎませんか。それとも、これら2つの方法の間に何らかの違いがありますか？

javascriptnullundefined
444
Tomas Vana

2つのケースを区別する必要があります。

  1. fooのように未定義の 変数 。 typeof以外のコンテキストで未定義の変数にアクセスするとエラーになります。

    if(typeof someUndefVar == whatever) // works

if(someUndefVar) // throws error

    そのため、変数の場合はtypeofチェックが必須です。反対に、それはめったに必要とされない - あなたの変数が定義されているかどうかあなたは通常 know である。

  2. someExistingObj.someUndefPropertyのように未定義の properties 。未定義のプロパティはエラーにならず、単にundefinedを返します。これは、ブール値に変換されるとfalseに評価されます。したがって、0とfalseを気にしないのであれば、if(obj.undefProp)を使用しても問題ありません。この事実に基づく一般的な慣用句があります。

    value = obj.prop || defaultValue

    これは、「objがプロパティpropを持つ場合、それをvalueに割り当て、それ以外の場合はデフォルト値defautValueを割り当てる」という意味です。

    この動作は見つけにくいエラーにつながると主張し、代わりに in 演算子を使用することをお勧めします

    value = ('prop' in obj) ? obj.prop : defaultValue
309
user187291

"value is null or undefined"をテストする最も効率的な方法は、

if ( some_variable == null ){
  // some_variable is either null or undefined
}

したがって、これら2行は等価です。

if ( typeof(some_variable) !== "undefined" && some_variable !== null ) {}
if ( some_variable != null ) {}

注1

質問で述べたように、短い変形はsome_variableが宣言されていることを必要とし、そうでなければReferenceErrorが投げられるでしょう。しかし多くのユースケースでは、これが安全であると仮定することができます。

オプションの引数をチェックします。

function(foo){
    if( foo == null ) {...}

既存のオブジェクトのプロパティを確認する

if(my_obj.foo == null) {...}

一方、typeofは、宣言されていないグローバル変数を扱うことができます（単にundefinedを返します）。それでもAlsciendeが説明したように、これらのケースは正当な理由から最小限に抑えるべきです。

注2

これ - もっと短い - 変種はnot同等です：

if ( !some_variable ) {
  // some_variable is either null, undefined, 0, NaN, false, or an empty string
}

そう

if ( some_variable ) {
  // we don't get here if some_variable is null, undefined, 0, NaN, false, or ""
}

注3

一般的には===の代わりに==を使用することをお勧めします。提案された解決策は、この規則の例外です。 JSHint構文チェッカー さえこの理由でeqnullオプションを提供します。

jQueryスタイルガイドから ：

厳密な等価検査（===）は==を優先して使用されるべきです。唯一の例外は、nullを使用してundefinedとnullをチェックする場合です。

// Check for both undefined and null values, for some important reason. 
undefOrNull == null;
370
mar10

通常の等価性でnullをチェックすると、undefinedに対してもtrueが返されます。

if (window.variable == null) alert('variable is null or undefined');

JS Equality

57
Semra

ES5やES6のような新しいJavaScript標準では、あなたはただ言うことができます

> Boolean(0) //false
> Boolean(null)  //false
> Boolean(undefined) //false

すべてfalseを返します。これはPythonの空の変数のチェックと似ています。あなたが変数の周りに条件付きロジックを書きたいのであれば、ちょうど言う

if (Boolean(myvar)){
   // Do something
}

ここでは、 "null"、 "空の文字列"、または "未定義"が効率的に処理されます。

26
Naren Yellavula

未宣言の変数を参照しようとすると、すべてのJavaScript実装でエラーがスローされます。

オブジェクトのプロパティは同じ条件の対象とはなりません。オブジェクトプロパティが定義されていない場合は、アクセスしてもエラーは発生しません。だからこのような状況であなたは短くすることができます：

 if (typeof(myObj.some_property) != "undefined" && myObj.some_property != null)

に

if (myObj.some_property != null)

これを念頭に置き、グローバル変数がグローバルオブジェクトのプロパティとしてアクセス可能であるという事実（ブラウザの場合はwindow）を使用して、グローバル変数に次のように使用できます。

if (window.some_variable != null) {
    // Do something with some_variable
}

ローカルスコープでは、変数がコードブロックの先頭で宣言されていることを確認すると常に便利です。これにより、typeofを繰り返し使用する必要がなくなります。

20
Andy E

まず、あなたは自分が何をテストするのかについて非常に明確にしなければなりません。 JavaScriptには、トリップアップのためのあらゆる種類の暗黙的な変換と、2つの異なるタイプの等価性比較子==と===があります。

nullまたはundefinedをテストする関数test(val)には、次の特性があります。

 test(null)         => true
 test(undefined)    => true
 test(0)            => false
 test(1)            => false
 test(true)         => false
 test(false)        => false
 test('s')          => false
 test([])           => false

ここにあるアイデアのどれが実際に私たちのテストに合格するか見てみましょう。

これらの仕事：

val == null
val === null || val === undefined
typeof(val) == 'undefined' || val == null
typeof(val) === 'undefined' || val === null

これらは機能しません。

typeof(val) === 'undefined'
!!val

これらのアプローチのうち、{ 正確さとパフォーマンスを比較するためのjsperfエントリー を作成しました。さまざまなブラウザ/プラットフォームで十分な実行が行われていないため、結果は当面の間決定的ではありません。コンピュータでテストを実行するのに少し時間がかかります。

現時点では、単純なval == nullテストで最高のパフォーマンスが得られるようです。それはまたほとんど最短です。補数が必要な場合、テストはval != nullに否定されることがあります。

15
Drew Noakes

変数に値があるかどうかを確認するだけです。意味、

if( myVariable ) {
//mayVariable is not :
//null
//undefined
//NaN
//empty string ("")
//0
//false

}

変数が存在するかどうかわからない場合（つまり、宣言されている場合）、typeof演算子を使用して確認する必要があります。例えば.

if( typeof myVariable !== 'undefined' ) {
    // myVariable will get resolved and it is defined
}
5
DDave

完全で正しい答えは1つもないので、要約します。

一般に、式

if (typeof(variable) != "undefined" && variable != null)

variableは宣言されていない可能性があるので簡略化することはできませんので、typeof(variable) != "undefined"を省略するとReferenceErrorが発生します。しかし、 文脈に従って式を単純化することができます ：

variableが global の場合は、次のように単純化できます。

if (window.variable != null)

local の場合、この変数が宣言されていない状況を避けることができます。

if (variable != null)

オブジェクトプロパティ であれば、ReferenceErrorを気にする必要はありません。

if (obj.property != null)
5
TMS

私はこの方法でこれをやった

IDを変数に保存します 

var someVariable = document.getElementById("someId");

次にif条件を使う

if(someVariable === ""){
 //logic
} else if(someVariable !== ""){
 //logic
}
4
Mab Kiani

答えの1つで述べたように、グローバルスコープを持つ変数について話しているなら、あなたは運がいいかもしれません。ご存知かもしれませんが、グローバルに定義した変数はwindowsオブジェクトに追加される傾向があります。あなたはこの事実を利用することができるので、あなたがblehと呼ばれる変数にアクセスしているとしましょう。ただ二重の逆演算子を使ってください（!!）

!!window['bleh'];

Blehが宣言されておらず、値が割り当てられていない場合、これはfalseを返します。

3
Farax

ブラウザで Developer tools を開き、次の図に示すコードを試してください。

Img1 Img2

2
Akash Preet

理解するために、未定義、null、 ''（空の文字列も）を変換したときにJavascript Engineが返す値を分析しましょう。開発者コンソールで同じことを直接確認できます。

enter image description here

あなたはすべてが偽に変換されているのを見ることができます、これはこれら3つすべてがJavaScriptによる「存在の欠如」を想定していることを意味します。そのため、以下のようにコード内の3つすべてを明示的にチェックする必要はありません。

if (a === undefined || a === null || a==='') {
    console.log("Nothing");
} else {
    console.log("Something");
}

また、もう1つ指摘したいことがあります。

Boolean（0）の結果はどうなりますか？

もちろん偽です。期待される結果で0が有効な値である場合、これはあなたのコードにバグを作成します。それで、あなたがコードを書くとき、あなたがこれをチェックすることを確認してください。

2
Code-EZ

yyy が未定義またはnullであれば、trueが返されます。

if (typeof yyy == 'undefined' || !yyy) {
    console.log('yes');
} else {
    console.log('no');
}

はい

if (!(typeof yyy == 'undefined' || !yyy)) {
    console.log('yes');
} else {
    console.log('no');
}

いいえ

2
Terry Lin

これは、Array includes（） メソッドを使った別の方法です。

[undefined, null].includes(value)
1
Jason

これが==が使われるべき唯一のケースです：

if (val == null) console.log('val is null or undefined')
1
Yukulélé

両方の値は、厳密比較演算子を使用して簡単に区別できます。

作業例：

http://www.thesstech.com/tryme?filename=nullandundefined

サンプルコード

function compare(){
    var a = null; //variable assigned null value
    var b;  // undefined
    if (a === b){
        document.write("a and b have same datatype.");
    }
    else{
        document.write("a and b have different datatype.");
    }   
}
0
Sohail Arif

無効性（if (value == null)）または非無効性（if (value != null)）をテストすることは、変数の定義状況をテストすることよりも冗長ではありません。

さらに、変数（またはオブジェクトプロパティ）の存在を確認するためのif (value)（またはif( obj.property)）のテストは、それがブール値false値で定義されていると失敗します。買い手責任負担 ：）

0
lucsorel

あなたが持っているものと同様に、あなたは以下のようなことをすることができます

if (some_variable === undefined || some_variable === null) { do stuff }

0
gpap