ホームページ > 記事 > ウェブフロントエンド > JavaScriptにおけるtypeofとinstanceofの比較使用例を詳しく解説
typeof
まずtypeofについて話しましょう。まず注意すべきことは、typeof メソッドはデータのタイプを表す文字列を返すということです。
typeof はオペランドの前に置かれる単項演算であり、オペランドは任意の型にすることができます。
戻り値は、オペランドの型を説明する文字列です。 Typeof は通常、
数値、ブール値、文字列、関数、オブジェクト、未定義の結果のみを返すことができます。 if(a) を使用する代わりに、typeof を使用して、変数が存在するかどうかを取得することができます (例: if(typeof a!="unknown"){alert("ok")}。 a が存在しない (宣言されていない) 場合は、エラーが発生した場合、配列や Null などの特殊なオブジェクトに対して typeof を使用すると、常に object が返されます。これは typeof の制限です。
文法説明
まず、各データ型に対応する typeof の値を見てみましょう:
typeof 37 === 'number'; typeof 3.14 === 'number'; typeof Math.LN2 === 'number'; typeof Infinity === 'number'; typeof NaN === 'number'; // 尽管NaN是"Not-A-Number"的缩写,意思是"不是一个数字" typeof Number(1) === 'number'; // 不要这样使用! // Strings typeof "" === 'string'; typeof "bla" === 'string'; typeof (typeof 1) === 'string'; // typeof返回的肯定是一个字符串 typeof String("abc") === 'string'; // 不要这样使用! // Booleans typeof true === 'boolean'; typeof false === 'boolean'; typeof Boolean(true) === 'boolean'; // 不要这样使用! // Symbols typeof Symbol() === 'symbol'; typeof Symbol('foo') === 'symbol'; typeof Symbol.iterator === 'symbol'; // Undefined typeof undefined === 'undefined'; typeof blabla === 'undefined'; // 一个未定义的变量,或者一个定义了却未赋初值的变量 // Objects typeof {a:1} === 'object'; // 使用Array.isArray或者Object.prototype.toString.call方法可以从基本的对象中区分出数组类型 typeof [1, 2, 4] === 'object'; typeof new Date() === 'object'; // 下面的容易令人迷惑,不要这样使用! typeof new Boolean(true) === 'object'; typeof new Number(1) ==== 'object'; typeof new String("abc") === 'object'; // 函数 typeof function(){} === 'function'; typeof Math.sin === 'function';
typeof がデータ型を正確に判断していないという問題が見つかります。たとえば、配列、正規表現、日付、オブジェクトの戻り値の typeof はすべてオブジェクトであるため、エラーが発生します。
そのため、型を決定する typeof に基づいて、Object.prototype.toString メソッドを使用してデータ型をさらに決定する必要もあります。
同じデータ型の場合のtoStringメソッドとtypeofメソッドの戻り値の違いを見てみましょう:
データ | toString | typeof |
---|---|---|
"foo" | String | string |
new String("foo") | String | オブジェクト |
新しい番号( 1.2) | 数値 | オブジェクト |
true | ブール | ブール |
new Boolean(true) | Boolean | object |
new Date() | Date | object |
new Error() | Error | object |
新しい配列(1, 2, 3) | Array | object |
/abc/g | RegExp | object |
new RegExp(“meow”) | RegExp | object |
可以看到利用toString方法可以正确区分出Array、Error、RegExp、Date等类型。
所以我们一般通过该方法来进行数据类型的验证
instanceof
接下来该说说instanceof方法了。instanceof运算符可以用来判断某个构造函数的prototype属性是否存在于另外一个要检测对象的原型链上。
instanceof 用于判断一个变量是否某个对象的实例,如 var a=new Array();alert(a instanceof Array); 会返回 true,同时 alert(a instanceof Object) 也会返回 true;这是因为 Array 是 object 的子类。再如:function test(){};var a=new test();alert(a instanceof test) 会返回
谈到 instanceof 我们要多插入一个问题,就是 function 的 arguments,我们大家也许都认为 arguments 是一个 Array,但如果使用 instaceof 去测试会发现 arguments 不是一个 Array 对象,尽管看起来很像。
如果对原型不太了解,可以看看深入理解原型。
下面我们看看instanceof的实例:
// 定义构造函数 function C(){} function D(){} var o = new C(); // true,因为 Object.getPrototypeOf(o) === C.prototype o instanceof C; // false,因为 D.prototype不在o的原型链上 o instanceof D; o instanceof Object; // true,因为Object.prototype.isPrototypeOf(o)返回true C.prototype instanceof Object // true,同上 C.prototype = {}; var o2 = new C(); o2 instanceof C; // true o instanceof C; // false,C.prototype指向了一个空对象,这个空对象不在o的原型链上. D.prototype = new C(); // 继承 var o3 = new D(); o3 instanceof D; // true o3 instanceof C; // true
但是这里我们需要注意一个问题:
function f(){ return f; } document.write(new f() instanceof f);//false function g(){} document.write(new g() instanceof g);//true
第一个为什么返回false呢?因为构造函数的原型被覆盖了。
以上がJavaScriptにおけるtypeofとinstanceofの比較使用例を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。