[JavaScript]typeof和instanceof的区别

[JavaScript]typeof和instanceof的区别

JS里面判断数据类型，一般用typeof或者instanceof两种方法，那么，两者到底有什么区别呢？

1. typeof

typeof用于基本数据类型的类型判断，返回值都为小写的字符串。如果是对象，除了function类型会返回“function”, 其他对象统一返回“object”。详情如下：



typeof.png

小贴士：

JavaScript基本数据类型为：
null, undefined, number, string, boolean, object

2. instanceof

instanceof 利用原型链继承关系做判断，它针对对象类型（格式：

对象 instanceof 构造函数

）。

“尽管instanceof 运算符的右操作数是构造函数，但计算过程实际上是检测了对象的继承关系，而不是检测创建对象的构造函数 ”（摘自《JavaScript权威指南》）

2.1 原型对象

一旦创建一个新函数，就会根据一组特定的规则为该函数创建一个

prototype

属性，该属性指向函数的原型对象

XXX.prototype

。在默认情况下，所有原型对象会自动获得一个

constructor

属性，该属性指向这个函数。

MDN上对原型上

constructor

的解释如下：

Returns a reference to the Object constructor function that created the instance object.
Note that the value of this property is a reference to the function itself, not a string containing the function's name.
译文：返回一个指向创建了该对象原型的函数引用。
需要注意的是，该属性的值是那个函数本身，而不是一个包含函数名称的字符串。

所有的对象都有constructor属性。如果一个对象没有显性指定constructor值，那么它将指向原始构造函数。如下所示：

var o = new Object;
o.constructor === Object; //true

var a = [];
a.constructor === Array; // true

var a = new Array;
a.constructor === Array //true

var n = new Number(3);
n.constructor === Number; // true

2.2 原型链继承

下面是一个典型原型链继承：

function SuperType() {
this.property = true;
}
SuperType.prototype.getSuperValue = function    () {
return this.property;
};
function SubType() {
this.subproperty = false;
}

SubType.prototype = new SuperType();
SubType.prototype.getSubValue = function    () {
return this.subproperty;
};
var instance = new SubType();

参考下图，可以看到，实例instance是由构造函数SubType创建的，默认情况下，instance的

__proto__

属性指向

SubType.prototype

(instance.constructor === SubType)。但是，由于做了

SubType.prototype = new SuperType()

操作，导致

SubType.prototype

指针指向SuperType的一个实例，并且SuperType实例的

__proto__

属性指向

SuperType.prototype

。

由此，生成原型链。



prototype.png

这时根据用

instanceof

做类型检测，结果如下：

instance instanceof SubType === true
instance instanceof SuperType === true

小贴士

如果把上面原型链继承的例子稍微做个改动，调整两行代码的顺序，如下：
SubType.prototype.getSubValue = function    () {
return this.subproperty;
};
SubType.prototype = new SuperType();

var instance = new SubType();
console.log(instance.getSubValue) // undefined

答案是undefined！原因是，SubType.prototype指针指向新的对象，导致无法访问之前老对象上的方法。

小结

typeof用于基本数据类型的类型判断，无法甄别对象具体类型（除了function）;

instanceof用于对象的类型判断，基于原型链上的继承关系