web-dev-qa-db-ja.com

typeof!== "未定義" vs.!= null

このように未定義のパラメータなどをチェックするJavaScriptコードをよく見ます。

if (typeof input !== "undefined") {
    // do stuff
}

冗長性は言うまでもありませんが、型検索と文字列比較の両方を含むため、これは無駄に思えます。ただし、「未定義」の名前を変更できるため、これは必要です。私の質問は、そのコードがこのアプローチよりも優れている点です。

if (null != input) {
    // do stuff
}

私の知る限りでは、nullを再定義することはできませんので、予期せずに中断することはありません。そして、!=演算子の型強制のために、これはundefinedとnull ...の両方をチェックします。それでもこの形式は普及しているようには見えませんし、JSLintがevil!=演算子を使用していると叫んでいることさえあります。どうしてこれは悪いスタイルだと思いますか?

456
Derek Thurn

typeofは、識別子が以前に宣言されたことがないため、より安全です。

if(typeof neverDeclared === "undefined") // no errors

if(neverDeclared === null) // throws ReferenceError: neverDeclared is not defined
662
seanmonstar

変数が(varキーワードを使って、関数の引数として、またはグローバル変数として)宣言されている場合、私はそれを行うための最良の方法だと思います。

if (my_variable === undefined)

jQueryがそれをやってくれるので、私にはそれで十分です:-)

それ以外の場合は、typeofを回避するためにReferenceErrorを使用する必要があります。

Undefinedが再定義されることを期待するなら、あなたはあなたのコードをこのようにラップすることができます:

(function(undefined){
    // undefined is now what it's supposed to be
})();
47
Joey Adams

良い方法:

if(typeof neverDeclared == "undefined") //no errors

しかし、最も見栄えの良い方法は、次の方法で確認することです。

if(typeof neverDeclared === typeof undefined) //also no errors and no strings
26
JOKe

未定義の名前が変更されることを心配する必要はありません。誰かが未定義の名前を変更した場合、チェックが失敗した場合、ほんの少数の問題よりもはるかに厄介になります。本当にコードを保護したい場合は、次のようにIFFE(すぐに呼び出される関数式)でラップしてください。

(function($, Backbone, _, undefined) {
    //undefined is undefined here.
})(jQuery, Backbone, _);

もしあなたがブラウザ環境で(すでに間違っている)グローバル変数を使って作業しているのなら、未定義のものをこのようにチェックします。

if(window.neverDefined === undefined) {
    //Code works
}

グローバル変数はウィンドウオブジェクトの一部なので、文字列にキャストして文字列を比較するのではなく、単純にundefinedをチェックすることができます。

それに加えて、なぜあなたの変数は定義されていないのですか?変数の存在をチェックし、それに基づいてアクションを実行するコードをたくさん見ました。私はこのアプローチが正しいところを見たことがありません。

12
Peeter

未定義が再定義されることが本当に心配な場合は、次のようなヘルパーメソッドを使ってこれを防ぐことができます。

function is_undefined(value) {
   var undefined_check; // instantiate a new variable which gets initialized to the real undefined value
   return value === undefined_check;
}

誰かがundefined = "foo"を書くとき彼は name undefinedを新しい値への参照のみを許すが、彼はundefinedの実際の値を変えないので、これはうまくいきます。

6
Ivo Wetzel

また、void演算子を使用して未定義の値を取得することもできます。

if (input !== void 0) {
    // do stuff    
}

(そして、別の回答で述べたように、変数が宣言されていない場合はエラーになりますが、コード検査、またはグローバル変数のテストにwindow.input !== void 0を使用する、var inputの追加など) 。)

4
Claude
function greet(name, greeting) {
  name = (typeof name !== 'undefined') ?  name : 'Student';
  greeting = (typeof greeting !== 'undefined') ?  greeting : 'Welcome';

  console.log(greeting,name);
}

greet(); // Welcome Student!
greet('James'); // Welcome James!
greet('Richard', 'Howdy'); // Howdy Richard!

//ES6 provides new ways of introducing default function parameters this way:

function greet2(name = 'Student', greeting = 'Welcome') {
//  return '${greeting} ${name}!';
console.log(greeting,name);
}

greet2(); // Welcome Student!
greet2('James'); // Welcome James!
greet2('Richard', 'Howdy'); // Howdy Richard!
1
Avinash Maurya

私は実際に(typeof input !== 'undefined')がデフォルトの関数パラメータを提供するために使われているこのシナリオで遭遇しました:

function greet(name, greeting) {
  name = (typeof name !== 'undefined') ?  name : 'Student';
  greeting = (typeof greeting !== 'undefined') ?  greeting : 'Welcome';

  return `${greeting} ${name}!`;
}

greet(); // Welcome Student!
greet('James'); // Welcome James!
greet('Richard', 'Howdy'); // Howdy Richard!

ES6では、デフォルトの関数パラメータをこのように導入する新しい方法が提供されています。

function greet(name = 'Student', greeting = 'Welcome') {
  return `${greeting} ${name}!`;
}

greet(); // Welcome Student!
greet('James'); // Welcome James!
greet('Richard', 'Howdy'); // Howdy Richard!

これは最初のオプションよりも冗長ではないです。

1
JSpecs
var bar = null;
console.log(typeof bar === "object"); //true yes 
//because null a datatype of object

var barf = "dff";
console.log(typeof barf.constructor);//function


console.log(Array.isArray(bar));//falsss


console.log((bar !== null) && (bar.constructor === Object)); //false

console.log((bar !== null) && (typeof bar === "object"));  // logs false
//because bar!==null, bar is a object


console.log((bar !== null) && ((typeof bar === "object") || (typeof bar === "function"))); //false

console.log(typeof bar === typeof object); //false
console.log(typeof bar2 === typeof undefined); //true
console.log(typeof bar3 === typeof undefinedff); //true
console.log(typeof bar2 == typeof undefined); //true

console.log((bar !== null) && (typeof bar === "object") && (toString.call(bar) !== "[object Array]")); //false
0
Avinash Maurya
(function(){

  var a= b = 3;
  var ed = 103;
  
})();



//console.log(ed); //ed is not defined

console.log("a defined? " + (typeof a !== 'undefined')); //no define
console.log("b defined? " + (typeof b !== 'undefined')); //yes define
console.log(typeof(b)); //number
console.log(typeof(4+7));   //number
console.log(b); //3
console.log(typeof("4"+"7")); //string
var e= "ggg";
console.log(typeof(e)); //string
 var ty=typeof(b);
console.log(ty); //number
console.log(typeof false); //boolean
console.log(typeof 1); //number
console.log(typeof 0); //number
console.log(typeof true); //boolean


console.log(typeof Math.tan);  //function
console.log(typeof function(){}); //function 

if(typeof neverDeclared == "undefined") //no errors
if(typeof neverDeclared === "undefined") //no errors

//if(neverDeclared == null) //showing error 


console.log(typeof {a:1}); //object
console.log(typeof null); //object
console.log(typeof JSON); //object
console.log(typeof Math); //object
console.log(typeof /a-z/); //object
console.log(typeof new Date()); //object

console.log(typeof afbc); //undefined
//console.log(typeof new);//error

document.write("<br> * oprator as math ");
var r=14*"4";
document.write(r);

document.write("<br> + oprator as string ");
var r=14+"44";
document.write(r);

document.write("<br> Minus Operator work as mathematic ");
var r=64-"44";
document.write(r);


document.write("<br>");
console.log(typeof(4*"7")); //returns number
console.log(typeof(4+"7")); //returns string




 
Interview Question in JavaScript
0
Avinash Maurya