判断js中的数据类型有一下几种方法：typeof、instanceof、 constructor、 prototype、 $.type()/jquery.type(),接下来主要比较一下这几种方法的异同。 先举几个例子：
<span class="hljs-keyword">var</span> a = <span class="hljs-string">"iamstring."</span>;
<span class="hljs-keyword">var</span> b = <span class="hljs-number">222</span>;
<span class="hljs-keyword">var</span> c= [<span class="hljs-number">1</span>,<span class="hljs-number">2</span>,<span class="hljs-number">3</span>];
<span class="hljs-keyword">var</span> d = <span class="hljs-keyword">new</span> <span class="hljs-built_in">Date</span>();
<span class="hljs-keyword">var</span> e = <span class="hljs-function"><span class="hljs-keyword">function</span>()</span>{alert(<span class="hljs-number">111</span>);};
<span class="hljs-keyword">var</span> f = <span class="hljs-function"><span class="hljs-keyword">function</span>()</span>{<span class="hljs-keyword">this</span>.name=<span class="hljs-string">"22"</span>;};1、最常见的判断方法：typeof
alert(<span class="hljs-built_in">typeof</span> a) ------------> <span class="hljs-built_in">string</span>
alert(<span class="hljs-built_in">typeof</span> b) ------------> number
alert(<span class="hljs-built_in">typeof</span> c) ------------> <span class="hljs-built_in">object</span>
alert(<span class="hljs-built_in">typeof</span> d) ------------> <span class="hljs-built_in">object</span>
alert(<span class="hljs-built_in">typeof</span> e) ------------> <span class="hljs-keyword">function</span>
alert(<span class="hljs-built_in">typeof</span> f) ------------> <span class="hljs-keyword">function</span>
其中<span class="hljs-built_in">typeof</span>返回的类型都是字符串形式，需注意，例如：
alert(<span class="hljs-built_in">typeof</span> a == <span class="hljs-string">"string"</span>) -------------> <span class="hljs-literal">true</span>
alert(<span class="hljs-built_in">typeof</span> a == <span class="hljs-built_in">String</span>) ---------------> <span class="hljs-literal">false</span>
另外<span class="hljs-built_in">typeof</span> 可以判断<span class="hljs-keyword">function</span>的类型；在判断除<span class="hljs-built_in">Object</span>类型的对象时比较方便。2、判断已知对象类型的方法： instanceof
alert(c <span class="hljs-keyword">instanceof</span> <span class="hljs-built_in">Array</span>) ---------------> <span class="hljs-literal">true</span>
alert(d <span class="hljs-keyword">instanceof</span> <span class="hljs-built_in">Date</span>)
alert(f <span class="hljs-keyword">instanceof</span> <span class="hljs-built_in">Function</span>) ------------> <span class="hljs-literal">true</span>
alert(f <span class="hljs-keyword">instanceof</span> <span class="hljs-function"><span class="hljs-keyword">function</span>) ------------> <span class="hljs-title">false</span>
注意：<span class="hljs-title">instanceof</span> 后面一定要是对象类型，并且大小写不能错，该方法适合一些条件选择或分支。</span>3、根据对象的constructor判断： constructor
alert(c.<span class="hljs-keyword">constructor</span> === <span class="hljs-keyword">Array</span>) ----------> true
alert(d.<span class="hljs-keyword">constructor</span> === Date) -----------> true
alert(e.<span class="hljs-keyword">constructor</span> === <span class="hljs-function"><span class="hljs-keyword">Function</span>) -------> <span class="hljs-title">true</span>
注意： <span class="hljs-title">constructor</span> 在类继承时会出错
<span class="hljs-title">eg</span>：
<span class="hljs-title">function</span> <span class="hljs-title">A</span><span class="hljs-params">()</span><span class="hljs-comment">{}</span>;</span>
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">B</span><span class="hljs-params">()</span><span class="hljs-comment">{}</span>;</span>
A.prototype = new B(); <span class="hljs-comment">//A继承自B</span>
<span class="hljs-keyword">var</span> aObj = new A();
alert(aobj.<span class="hljs-keyword">constructor</span> === B) -----------> true;
alert(aobj.<span class="hljs-keyword">constructor</span> === A) -----------> false;
而instanceof方法不会出现该问题，对象直接继承和间接继承的都会报true：
alert(aobj instanceof B) ----------------> true;
alert(aobj instanceof B) ----------------> true;
言归正传，解决construtor的问题通常是让对象的<span class="hljs-function"><span class="hljs-keyword">constructor</span>手动指向自己：
<span class="hljs-title">aobj</span>.<span class="hljs-title">constructor</span> = <span class="hljs-title">A</span>;</span> <span class="hljs-comment">//将自己的类赋值给对象的constructor属性</span>
alert(aobj.<span class="hljs-keyword">constructor</span> === A) -----------> true;
alert(aobj.<span class="hljs-keyword">constructor</span> === B) -----------> false; <span class="hljs-comment">//基类不会报true了;</span>4、通用但很繁琐的方法： prototype
alert(<span class="hljs-built_in">Object</span>.prototype.toString.<span class="hljs-keyword">call</span>(a) === ‘[<span class="hljs-built_in">object</span> <span class="hljs-built_in">String</span>]’) -------> <span class="hljs-literal">true</span>;
alert(<span class="hljs-built_in">Object</span>.prototype.toString.<span class="hljs-keyword">call</span>(b) === ‘[<span class="hljs-built_in">object</span> Number]’) -------> <span class="hljs-literal">true</span>;
alert(<span class="hljs-built_in">Object</span>.prototype.toString.<span class="hljs-keyword">call</span>(c) === ‘[<span class="hljs-built_in">object</span> Array]’) -------> <span class="hljs-literal">true</span>;
alert(<span class="hljs-built_in">Object</span>.prototype.toString.<span class="hljs-keyword">call</span>(d) === ‘[<span class="hljs-built_in">object</span> <span class="hljs-built_in">Date</span>]’) -------> <span class="hljs-literal">true</span>;
alert(<span class="hljs-built_in">Object</span>.prototype.toString.<span class="hljs-keyword">call</span>(e) === ‘[<span class="hljs-built_in">object</span> <span class="hljs-keyword">Function</span>]’) -------> <span class="hljs-literal">true</span>;
alert(<span class="hljs-built_in">Object</span>.prototype.toString.<span class="hljs-keyword">call</span>(f) === ‘[<span class="hljs-built_in">object</span> <span class="hljs-keyword">Function</span>]’) -------> <span class="hljs-literal">true</span>;
大小写不能写错，比较麻烦，但胜在通用。5、无敌万能的方法：jquery.type()
如果对象是undefined或null，则返回相应的“undefined”或“null”。
jQuery.<span class="hljs-built_in">type</span>( undefined ) === <span class="hljs-string">"undefined"</span>
jQuery.<span class="hljs-built_in">type</span>() === <span class="hljs-string">"undefined"</span>
jQuery.<span class="hljs-built_in">type</span>( window.notDefined ) === <span class="hljs-string">"undefined"</span>
jQuery.<span class="hljs-built_in">type</span>( null ) === <span class="hljs-string">"null"</span>
如果对象有一个内部的<span class="hljs-string">[[Class]]</span>和一个浏览器的内置对象的 <span class="hljs-string">[[Class]]</span> 相同，我们返回相应的 <span class="hljs-string">[[Class]]</span> 名字。 (有关此技术的更多细节。 )
jQuery.<span class="hljs-built_in">type</span>( <span class="hljs-keyword">true</span> ) === <span class="hljs-string">"boolean"</span>
jQuery.<span class="hljs-built_in">type</span>( <span class="hljs-number">3</span> ) === <span class="hljs-string">"number"</span>
jQuery.<span class="hljs-built_in">type</span>( <span class="hljs-string">"test"</span> ) === <span class="hljs-string">"string"</span>
jQuery.<span class="hljs-built_in">type</span>( <span class="hljs-function"><span class="hljs-keyword">function</span><span class="hljs-params">()</span></span>{} ) === <span class="hljs-string">"function"</span>
jQuery.<span class="hljs-built_in">type</span>( [] ) === <span class="hljs-string">"array"</span>
jQuery.<span class="hljs-built_in">type</span>( new Date() ) === <span class="hljs-string">"date"</span>
jQuery.<span class="hljs-built_in">type</span>( new Error() ) === <span class="hljs-string">"error"</span> // as of jQuery <span class="hljs-number">1.9</span>
jQuery.<span class="hljs-built_in">type</span>( /test/ ) === <span class="hljs-string">"regexp"</span>
其他一切都将返回它的类型“object”。通常情况下用typeof 判断就可以了，遇到预知Object类型的情况可以选用instanceof或constructor方法,实在没辙就使用$.type()方法。
评论1
暂时没有评论