JavaScript对象类型判断的三种方式：typeof、constructor与Object.prototype.toString

JavaScript类型判断概述

近期阅读John Resig所著的《Pro JavaScript Techniques》时，书中探讨了JavaScript类型判断的实现方式，主要介绍了typeof和constructor两种手段。令人稍感意外的是，作为jQuery作者的John Resig并未在书中提及jQuery内部使用的类型判断方法。为此，本文将对这些方法进行汇总与补充说明。

在开始之前，推荐一个实用的在线编辑器：http://jsfiddle.net/。该工具提供了jQuery、mootools、prototype和YUI等主流JavaScript框架的多个版本，非常适合编写简单的JS测试程序，省去了本地配置环境和创建文件的繁琐步骤。编辑代码后点击[Run]按钮即可运行。

typeof方法的局限性

1.typeof

typeof是进行类型判断时最常用的方法，其优势在于简单且易于记忆。然而，它的局限性在于无法准确区分object、null、array、regexp以及自定义对象类型。

以下是具体的测试代码示例：

var str='str';
var arr=['1','2'];
var num=1;
var bool=true;
var obj={name:'test'};
var nullObj=null;
var undefinedObj=undefined;
var reg=/reg/;
function fn(){
 alert('this is a function');
}
function User(name){
 this.name=name;
}
var user=new User('user');
console.log(typeof str);
console.log(typeof arr);
console.log(typeof num);
console.log(typeof bool);
console.log(typeof obj);
console.log(typeof nullObj);
console.log(typeof undefinedObj);
console.log(typeof reg);
console.log(typeof fn);
console.log(typeof user);

代码运行结果：

constructor方法的适用场景

2.constructor

接下来介绍一种较少使用的方法，即利用对象的constructor属性。该方法的优点在于支持大部分对象类型的判断，尤其适用于自定义对象的识别；其缺点则是无法在null和undefined上调用，会引发错误。

测试代码与前述类似，主要区别在于使用XXX.constructor替代了typeof进行判断。

var str='str';
var arr=['1','2'];
var num=1;
var bool=true;
var obj={name:'test'};
var nullObj=null;
var undefinedObj=undefined;
var reg=/reg/;
function fn(){
alert('this is a function');
}
function User(name){
this.name=name;
}
var user=new User('user');
console.log(str.constructor);
console.log(arr.constructor);
console.log(num.constructor);
console.log(bool.constructor);
console.log(obj.constructor);
console.log(reg.constructor);
console.log(fn.constructor);
console.log(user.constructor);
console.log(nullObj.constructor);
console.log(undefinedObj.constructor);

运行结果：

当执行到 console.log(nullObj.constructor); 时，浏览器会报错：Uncaught TypeError: Cannot read property 'constructor' of null。类似的错误也出现在 console.log(undefinedObj.constructor); 上：Uncaught TypeError: Cannot read property 'constructor' of undefined。

Object.prototype.toString.call()的优势

3.Object.prototype.toString.call()

最后介绍jQuery中采用的方式，即Object.prototype.toString.call()。该方法的优点是支持绝大多数类型的判断，唯一的不足在于无法直接用于自定义对象的类型区分。

测试代码如下：

var str='str';
var arr=['1','2'];
var num=1;
var bool=true;
var obj={name:'test'};
var nullObj=null;
var undefinedObj=undefined;
var reg=/reg/;
function fn(){
alert('this is a function');
}
function User(name){
this.name=name;
}
var user=new User('user');
var toString=Object.prototype.toString;
console.log(toString.call(str));
console.log(toString.call(arr));
console.log(toString.call(num));
console.log(toString.call(bool));
console.log(toString.call(obj));
console.log(toString.call(reg));
console.log(toString.call(fn));
console.log(toString.call(user));
console.log(toString.call(nullObj));
console.log(toString.call(undefinedObj));

运行结果：

对于 console.log(toString.call(user));，其返回结果为：[object Object]，因此无法据此进行进一步的类型判断。

三种方法对比与推荐方案

总结

JavaScript中常用的对象类型判断方式主要包括：typeof、constructor和Object.prototype.toString.call()。其中，typeof易于理解，是JavaScript原生支持的语法；constructor虽使用较少，但通过示例不难理解其含义；至于Object.prototype.toString.call()，可能稍显晦涩，它与XXX.toString()有何区别？为何不能直接使用XXX.toString()？

我们在浏览器中运行以下代码以查看结果：

null和undefined由于不存在toString()方法，调用时会报错，此处暂不讨论。对于其他对象，通过toString()返回的内容与使用Object.prototype.toString.call()返回的内容存在显著差异。这是因为Object.prototype.toString()方法的设计初衷是返回对象类型。String、Array、Boolean、Regexp、Number和Function均继承自Object，并继承了Object的原型方法toString()，但它们都对toString()进行了重写。执行xxx.toString()时调用的是重写后的方法，因此返回结果与Object.prototype.toString.call()不一致。

通过上述示例，相信大家对这三种方式有了更深刻的理解，熟悉它们的优缺点后，可根据实际需求选择合适的方法。推荐使用Object.prototype.toString.call()方法，因为它能解决绝大部分类型的判断问题；当遇到返回值为[object Object]时，再结合constructor辅助判断，以确认是否为自定义对象。

var str='str';
var arr=['1','2'];
var num=1;
var bool=true;
var obj={name:'test'};
var nullObj=null;
var undefinedObj=undefined;
var reg=/reg/;
function fn(){
alert('this is a function');
}
function User(name){
this.name=name;
}
var user=new User('user');
console.log(str.toString());
console.log(arr.toString());
console.log(num.toString());
console.log(bool.toString());
console.log(obj.toString());
console.log(reg.toString());
console.log(fn.toString());
console.log(user.toString());
console.log(nullObj.toString());
console.log(undefinedObj.toString());