web-dev-qa-db-ja.com

変数が存在するかどうかのJavaScriptチェック（定義/初期化済み）

変数が初期化されているかどうかを確認する方法はどれが良いですか？ （変数が何か（文字列、整数、オブジェクト、関数など）を保持できると仮定します。）

if (elem) { // or !elem

または

if (typeof(elem) !== 'undefined') {

または

if (elem != null) {
javascriptvariablesif-statementinitializationundefined
1483
Samuel Liew

typeof演算子は、変数が本当に未定義かどうかを調べます。

if (typeof variable === 'undefined') {
    // variable is undefined
}

typeof演算子は、他の演算子とは異なり、宣言されていない変数と一緒に使用した場合に ReferenceError 例外をスローしません。

ただし、typeof nullは"object"を返すことに注意してください。変数をnullに初期化する間違いを避けるように注意しなければなりません。安全のために、これを代わりに使用することができます。

if (typeof variable === 'undefined' || variable === null) {
    // variable is undefined or null
}

単純な同等性===の代わりに厳密な比較==を使うことに関するさらなる情報は、以下を見てください：
JavaScriptとの比較では、どの等号演算子（== vs ===）を使用する必要がありますか？

771
Samuel Liew

typeof演算子 が必要です。具体的には：

if (typeof variable !== 'undefined') {
    // the variable is defined
}
2745
Jim Puls

JavaScriptでは、変数は定義できますが、値undefinedを保持できるため、最も一般的な答えは技術的に正しくなく、代わりに次のことを行います。

if (typeof v === "undefined") {
   // no variable "v" is defined in the current scope
   // *or* some variable v exists and has been assigned the value undefined
} else {
   // some variable (global or local) "v" is defined in the current scope
   // *and* it contains a value other than undefined
}

それはあなたの目的には十分かもしれません。次のテストはより単純なセマンティクスを持っています、それはあなたがあなたのコードのふるまいを正確に記述し、（あなたがそのようなことに関心があるなら）あなた自身を理解することをより簡単にします：

if ("v" in window) {
   // global variable v is defined
} else {
   // global variable v is not defined
}

これは、もちろんブラウザで実行していることを前提としています（windowはグローバルオブジェクトの名前です）。しかし、もしあなたがこのようなグローバルをいじっているのなら、おそらくブラウザを使っているでしょう。主観的に見て、'name' in windowを使用することはグローバルを参照するためにwindow.nameを使用することと文体的に一貫しています。変数としてではなくwindowのプロパティとしてグローバルにアクセスすると、コード内で参照する未宣言の変数の数を最小限に抑えることができ（リンティングのために）、グローバルがローカル変数によって隠される可能性がなくなります。また、グローバルがスキンをクロールする場合は、この比較的長いスティックを使用した場合にのみ、より快適に触れることができます。

196
Brian Kelley

多くの場合、以下を使用します。

if (elem) { // or !elem

...あなたのために仕事をするでしょう！...これはこれらの以下のケースをチェックします：

  1. 未定義 ：値が定義されておらず、それがundefinedである場合
  2. null ：DOM要素が存在しない場合など、nullの場合.
  3. 空の文字列 ：''
  4. 0 ：数値ゼロ
  5. NaN ：数値ではありません
  6. false

それで、それはすべてのケースの種類をカバーします、しかし、私たちがカバーしたい奇妙なケースも常にあります、例えば、この' 'のようなスペースを持つ文字列、これはスペースを持つJavaScriptとして定義されますstring ...たとえば、この場合、trim（）を使用してもう1つチェックを追加します。

if(elem) {

if(typeof elem === 'string' && elem.trim()) {
///

また、これらのチェックは values に対してのみ行われます。Javascriptではオブジェクトと配列の動作が異なるため、空の配列[]と空のオブジェクト{}は常に true です。

私は答えの簡単な概要を示すために下の画像を作成します。

undefined, null, etc

167
Alireza

ほとんどの場合、あなたは使うでしょう：

elem != null

単純なif (elem)とは異なり、0、false、NaNおよび''を許可しますが、nullまたはundefinedを拒否するので、引数の存在、またはオブジェクトのプロパティについての一般的なテストには適しています。

他のチェックも間違っているわけではなく、使い方が違うだけです。

  • if (elem)：elemがオブジェクトであることが保証されている場合、またはfalse、0などが「デフォルト」の値と見なされる場合（つまりundefinedまたはnullと同等）に使用できます。

  • typeof elem == 'undefined'は、指定されたnullが初期化されていない変数またはプロパティに対して明確な意味を持つ場合に使用できます。

    • elemが宣言済みでない場合（つまりvar文がない場合、windowのプロパティでない場合、または関数の引数でない場合）、エラーをスローしないをチェックする唯一の方法です。私の意見では、これはタイプミスが気付かれずに滑ることを可能にするのでかなり危険です。これを回避するには、以下の方法を参照してください。

undefinedに対する厳密な比較も有用です。

if (elem === undefined) ...

ただし、グローバルundefinedは別の値でオーバーライドできるため、使用する前に現在のスコープで変数undefinedを宣言するのが最善です。

var undefined; // really undefined
if (elem === undefined) ...

または

(function (undefined) {
    if (elem === undefined) ...
})();

このメソッドの副次的な利点は、JSミニファイアがundefined変数を1文字に減らし、毎回数バイト節約できることです。

116
David Tang

変数が存在するかどうかを調べる方法

これは、変数が存在し初期化されているかどうかをテストするための非常に優れた解決策です。

var setOrNot = typeof variable !== typeof undefined;

これは、ある変数が初期化されていない場合にデフォルトを設定するために、 三項演算子 と組み合わせて使用​​されるのが最も一般的です。

var dark = typeof darkColor !== typeof undefined ? darkColor : "black";

カプセル化に関する問題

残念ながら、あなたは単にあなたのチェックを関数にカプセル化することはできません。

あなたはこのようなことをすることを考えるかもしれません：

function isset(variable) {
    return typeof variable !== typeof undefined;
}

しかし、これを呼び出すと参照エラーが発生します。存在しない変数を関数に渡すことはできないため、isset(foo)および変数fooは定義されていません。

不明なReferenceError：fooが定義されていません

関数パラメータが未定義かどうかのテスト

私たちのisset関数は変数が存在するかどうかをテストするために使用することはできませんが（上記の理由で）、関数のパラメータが未定義かどうかをテストすることができます。

var a = '5';

var test = function(x, y) {
    console.log(isset(x));
    console.log(isset(y));
};

test(a);

// OUTPUT :
// ------------
// TRUE
// FALSE

yの値が関数testに渡されない場合でも、issetは関数yの値としてtestとして知られているので、このコンテキストではundefined関数は完全に機能します。

65
John Slegers

オブジェクトがないか確認してください hasOwnProperty()

多くのtypeof回答に代わるものは、hasOwnProperty()の使用です。これはもちろんオブジェクト（特にJSのほとんどすべて）が（とりわけ）変数すなわちを持つかどうかをチェックします。

hasOwnProperty()メソッドは、オブジェクトが指定されたプロパティを独自の（継承されていない）プロパティとして持つかどうかを示すブール値を返します。

Object から派生したすべてのオブジェクトはhasOwnProperty()メソッドを継承します。このメソッドは、オブジェクトが指定されたプロパティをそのオブジェクトの直接プロパティとして持っているかどうかを判断するために使用できます。 in 演算子とは異なり、このメソッドはオブジェクトのプロトタイプチェーンをチェックしません。

// Globally established (therefore) properties of window
var foo = "whatever", // string
    bar = false,      // bool
    baz;              // undefined
// window.qux does not exist

console.log( [
    window.hasOwnProperty( "foo" ),             // true
    window.hasOwnProperty( "bar" ),             // true
    window.hasOwnProperty( "baz" ),             // true
    window.hasOwnProperty( "qux" ),             // false
    { foo: [], bar: 0 }.hasOwnProperty( "bar" ) // true
] );

hasOwnProperty()の素晴らしいところは、それを呼び出す際に、まだ定義されていない可能性のある変数を使用しないことです。もちろん、これは最初の問題の半分です。

always perfectまたは理想解決策ではありませんが、特定の状況では、それは単なる仕事です！

48
Fred Gandt

簡単な割り当てや関連するチェックを実行するときに、これをチェックするもう1つの簡単な方法があります。単に Conditional（Ternary）Operatorを使用してください。 

var values = typeof variable !== 'undefined' ? variable : '';

参照変数のインスタンス代入を使用してグローバル変数を宣言しようとしたときにも、これは役に立ちます。

変数をチェックしたい場合は、undefinedやnullにしないでください。その後、以下の確認を行ってください。

変数が宣言されているとき、そして値をチェックしたいのであれば、これは単純です。 そして、undefinedとnullのチェックを一緒に実行します。 

var values = variable ? variable : '';
42
RajeshKdev

変数が定義されていることを気にしているのか、それとも意味のある値にしたいのかによって異なります。

型が未定義かどうかを確認すると、変数がまだ定義されているかどうかが確認されます。

=== nullまたは!== nullは、変数の値が正確にnullであるかどうかだけをチェックします。

== nullまたは!= nullは、値がundefinedまたはnullであるかどうかを調べます。

if(value)は、変数がundefined、null、0、または空の文字列かどうかをチェックします。

29
Alan Geleynse

未定義、ブール値、文字列、数値、関数

 if（typeof foo！== '未定義'）{
 
}

オブジェクト、配列

if( foo instanceof Array ) { 

}
28
Yuan Zhaohao

最も高い答えは正しいです、typeofを使用してください。

しかし、私が指摘したかったのは、JavaScriptではundefinedが変更可能であるということでした（なんらかの不思議な理由で）。そのため、単にvarName !== undefinedをチェックするだけでは期待どおりに戻らない可能性があります。他のライブラリが未定義に変更されている可能性があるためです。いくつかの回答（@ skaleeなど）はtypeofを使用しない方が良いように思われますが、それが原因で問題が発生する可能性があります。

これを扱うための「古い」方法は、undefinedの潜在的なミュート/上書きを相殺するための変数としてundefinedを宣言することでした。ただし、他のコードからのtypeofのオーバーライドは無視されるため、最善の方法は依然としてundefinedを使用することです。特に、あなたがそのページで他に何が実行されているのかを知っている、野性で使用するためのコードを書いているなら...

13
shadowstorm
if (typeof console != "undefined") {    
   ...
}

それ以上

if ((typeof console == "object") && (typeof console.profile == "function")) {    
   console.profile(f.constructor);    
}

すべてのブラウザで動作します

11
boslior

議論に貢献するために、変数が文字列かオブジェクトでなければならないことがわかっていれば、私はいつもif (!variable)を好むので、その偽造がないかチェックしてください。これにより、以下のように、よりクリーンなコードにすることができます。

if (typeof data !== "undefined" && typeof data.url === "undefined") {
    var message = 'Error receiving response';
    if (typeof data.error !== "undefined") {
        message = data.error;
    } else if (typeof data.message !== "undefined") {
        message = data.message;
    }
    alert(message); 
}

..に減らすことができます：

if (data && !data.url) {
  var message = data.error || data.message || 'Error receiving response';
  alert(message)
}
9
de3

これらの答え（Fred Gandtの解を除く）はすべて正しくないか不完全です。

undefined値を伝えるために私のvariableName;が必要であり、それゆえvar variableName;のような方法で宣言されていると仮定します。これはすでに 初期化された を意味します。 - すでに宣言されているかどうかはどうやって確認できますか？

それとももっと良いのですか？ "Book1.chapter22.paragraph37"が1回の呼び出しで存在するかどうかをすぐに確認するにはどうすればよいですか。ただし、参照エラーは発生しません。

最も強力なJasvaScript演算子、 in 演算子を使用してこれを行います。

"[variable||property]" in [context||root] 
>> true||false

AJAX人気がピークに達する時代に、 "Book1.chapter22.paragraph37"のようなプロパティ名の詳細なテストを含む名前空間が存在するかどうかを判断できるisNS（）というメソッドを書きましたより多く。

しかし、それは以前に公開されてきたので、その重要性のために別のスレッドで公開されるに値します。ここでは投稿しませんが、ソースを見つけるのに役立つキーワード（ javascript + isNS ）を提供しますすべての必要な説明で裏付けられたコード。

8
Bekim Bacaj

未定義とnullを区別することは困難です。 Null は、変数に特定の値がないことを示す場合に変数に割り当てることができる値です。 未定義 は、割り当てられていない変数のデフォルト値となる特別な値です。


var _undefined;
var _null = null;

alert(_undefined); 
alert(_null); 
alert(_undefined == _null);
alert(_undefined === _null);
8
Jith

NullはJavaScriptの値で、typeof nullは"object"を返します。

したがって、null値を渡すと、受け入れられた回答は機能しません。 null値を渡す場合は、null値に対する追加のチェックを追加する必要があります。

if ((typeof variable !== "undefined") && (variable !== null))  
{
   // the variable is defined and not null
}
8
Razan Paul

最も堅牢な '定義されている'チェックは typeof で行われます。

if (typeof elem === 'undefined')

デフォルトを割り当てるために定義された変数をチェックしているだけであれば、読みやすくするために次のようにします。

elem = elem || defaultElem;

よく使うことです、参照： JavaScriptでデフォルト値を設定する慣用的な方法

typeof キーワードを使用したこのライナーもあります。

elem = (typeof elem === 'undefined') ? defaultElem : elem;
7
Zv_oDD

typeof演算子を使うことができます。

例えば、

var dataSet;

alert("Variable dataSet is : " + typeof dataSet);

上記のコードスニペットは、次のような出力を返します。

変数dataSetは未定義です。

7
Ravindra Miyani

私の好みはtypeof(elem) != 'undefined' && elem != nullです。

どのように選択しても、そのような関数にチェックを入れることを検討してください

function existy (x) {
    return typeof (x) != 'undefined' && x != null;
}

変数が宣言されていることがわからない場合は、typeof (x) != 'undefined' && x != null;を続けてください。

変数が宣言されていても存在しないかもしれないことがわかっている場合は、次のようにします。

existy(elem) && doSomething(elem);

チェックしている変数はネストしたプロパティである場合があります。 prop ||を使うことができます問題のプロパティへの存在を確認する行を下に移動するには、{}を使用します。

var exists = ((((existy(myObj).prop1||{}).prop2||{}).prop3||{})[1]||{}).prop4;

各プロパティの後に（... '|| {}'）。nextPropを使用して、見つからないプロパティがエラーにならないようにします。

あるいはexisty(o) && existy(o.p) && existy(o.p.q) && doSomething(o.p.q)のように存在物を使うこともできます

5
curtwphillips

オブジェクトに応じて2つの方法を使います。

if( !variable ){
  // variable is either
  // 1. '';
  // 2. 0;
  // 3. undefined;
  // 4. null;
  // 5. false;
}

空の文字列をfalseと評価したくない場合があるので、次にこのケースを使用します。

function invalid( item ){
  return (item === undefined || item === null);
}

if( invalid( variable )){
  // only here if null or undefined;
}

反対が必要な場合は、最初の例では！変数は!!変数になり、無効な関数では===は！=になり、関数名はnotInvalidに変わります。

5
SoEzPz

質問で概説されている特定の状況では、

typeof window.console === "undefined"

と同じです

window.console === undefined

後者の方が短いので私は好きです。

consoleはグローバルスコープ（すべてのブラウザでwindowオブジェクト）でのみ検索されることに注意してください。この特定の状況では望ましいです。 consoleを他の場所で定義したくありません。

@ BrianKelleyが彼のすばらしい答えの中で技術的な詳細を説明しています。私は結論が足りないことを付け加え、読みやすくするために要約しました。

5
skalee

定義済みブロックに何かをさせたい場合は、これを使用してください。

if (typeof variable !== 'undefined') {
    // the variable is defined
}

未定義のブロックに何かをさせたり、変数を割り当てたり定義したりしたい場合は、これを使用してください。

if (typeof variable === 'undefined') {
    // the variable is undefined
}
5
Vinayak Shedgeri

もう少し機能的で使いやすい：

function exist(obj)
{
    return (typeof obj !== 'undefined');
}

この関数は、存在する場合は true を返し、存在しない場合は false を返します。

3
tfont

「未定義」に対して！==または！=をチェックすると機能しないことに注意してください

Firfox Quantom 60.0.1でテスト済み

競合を避けるために、代わりにこのようなテストを使用してください

if(!(typeof varibl['fl'] === 'undefined')) {

            console.log(varibl['fl']);
            console.log("Variable is Defined");
        }else{

            console.log(varibl['fl']);
            console.log("Variable is Un-Defined");
        }
3
Aylian Craspa

状況によって異なります。コードの外でグローバルに定義されているかどうかにかかわらず（おそらくjQueryのような）何かを調べているなら、あなたは欲しいです：

if (typeof(jQuery) != "undefined")

（厳密な等価性は必要ありません。typeofは常に文字列を返します。）しかし、渡されることも渡されないこともある関数への引数がある場合、それらは常に定義されますが、省略するとnullになります。

function sayHello(name) {
    if (name) return "Hello, " + name;
    else return "Hello unknown person";
}
sayHello(); // => "Hello unknown person"
3
jpsimons

単純なものはどうですか：

if(!!variable){
  //the variable is defined
}
2
JasoonS

私はこれがまだ言及されていないことに驚きました...

これがthis['var_name']を使ったいくつかの追加のバリエーションです

このメソッドを使用する利点は、変数が定義される前に使用できることです。

if (this['elem']) {...}; // less safe than the res but works as long as you're note expecting a falsy value
if (this['elem'] !== undefined) {...}; // check if it's been declared
if (this['elem'] !== undefined && elem !== null) {...}; // check if it's not null, you can use just elem for the second part

// these will work even if you have an improper variable definition declared here
elem = null; // <-- no var here!! BAD!
2
Daniel

変数をテストするための簡単な方法は宣言されていません（未定義ではありません）。

if (typeof variable === "undefined") {
  ...
}

私はそれがブラウザの外で走っているスクリプトを検出するのに有用であるとわかりました（window変数を宣言しなかった）。

0
user2878850

変数が宣言または設定されているかどうかをチェックするために、私はこの汚いトリックをしました。

evalを使っても、コードを関数に抽出する方法が見つかりませんでした。

"use strict";

// var someVar;

var declared;
try {
  someVar;
  declared = true;
} catch(e) {
  declared = false;
}

if (declared) {
  console.log("someVar is declared; now has the value: " + someVar);
} else {
  console.log("someVar is not declared");
}
0
Ferran Maylinch