typeOf、instanceOf、valueOf区别

一、typeOf

typeof操作符返回一个字符串,表示未经求值的操作数(unevaluated operand)的类型

Js中对象一共有六种主要类型

• number

• null

• boolean

• undefined

• string

• object

Paste_Image.png

可以看到typeOf并不能判断出Array和null以及object之间的区别

注：null和{}的typeOf结果相同是因为不同的对象在底层都表示为二进制对象，js中前三位都为0的话会被判断为object类型
,null的二进制表示全是0，所以执行typeOf会返回object

扩展:

要想判断是不是数组的话，可以
// 使用Array.isArray或者Object.prototype.toString.call方法可以从基本的对象中区分出数组类型

方法一：

e.g Array.isArray

var a=[]; Array.isArray(a); //true;
var a={}; Array.isArray(a); //false;
var a=function(){}; Array.isArray(a); //false;

如果不存在Array.isArray(),需要自定义方法(实际上就是用object.prototype.toString.call)，ie9+才支持Array.isArray()

if(!Array.isArray){
Array.isArray=function(arg){
return Object.prototype.toString.call(arg)==='[object Array]';
}
}

方法二、

更准确地判断出对象的类型（不止可以用来判断数组）
e.g object.prototype.toString.call
返回的结果是'[object result]'这样的形式，使用slice截取指定区域的字符串就可以得到对象的类型

Paste_Image.png

Paste_Image.png

二、instanceOf

MDN中的原话描述是这样的：

instanceof运算符可以用来判断某个构造函数的prototype属性所指向的對象是否存在于另外一个要检测对象的原型链上，
检测constructor.prototype 是否存在于参数 object 的原型链上

a instanceOf b 其实就是检测a是不是b的一个实例对象或者是b的子类的一个实例对象

判断一个实例是否属于某种类型

还可以在继承关系中判断一个实例是否属于它的父类型

// 判断 foo 是否是 Foo 类的实例 , 并且是否是其父类型的实例
function Parent(){} 
function Child(){} 
Child.prototype = new Parent();//原型继承
 
var child = new Child(); 
console.log(child  instanceof Child)//true 
console.log(child  instanceof Parent)//true

这里就涉及到了原型链的相关知识了
暂挂起不表，下一篇文章详细写这个

三、valueOf

• booleanObject.valueOf()可返回 Boolean 对象的原始值。

var boo=new Boolean(false);
console.log(boo.valueOf()) //false

• stringObject.valueOf()可返回 String 对象的原始值,原始值是由从 String 对象下来的所有对象继承的

var boo=new String('test');
console.log(boo.valueOf()) //test
var boo='test';
console.log(boo.valueOf()) //test

• arrayObject.valueOf()返回 Array 对象的原始值,该原始值由 Array 对象派生的所有对象继承。

var boo=[2,3];
console.log(boo.valueOf()) //[2,3]

• NumberObject.valueOf()可以字符串返回数字，字符串的输出通常等于该数字。

var boo=456; 
console.log(boo.valueOf()) // 456

• DateObject.valueOf() 方法返回 Date 对象的原始值。date 的毫秒表示。返回值和方法 Date.getTime 返回的值相等。

var boo=new Date();
console.log(boo.valueOf()) //1460605379960

• object.valueOf()

var boo={};
console.log(boo.valueOf())  //Object {}

var boo={'data':2};
console.log(boo.valueOf()) //Object {data: 2}

参考资料:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/typeof