原生JS篇三、数据类型及类型检测

本篇文章内容：

ECMAScript数据类型有哪些
基本数据类型（也叫简单数据类型）中的undefined和null的区别与联系
typeOf()函数判断基本数据类型
instanceof用于判断引用数据类型
Object.prototype.toString.call()检测数据类型的通用方法
扩展constructor属性检测数据类型方式以及数组进行类型检测时需注意的事项

ECMAScript有几种数据类型？

ECMAScript中有5种简单数据类型（也称为基本数据类型）：undefined、Null、Boolean、Number、String;
有一种复杂数据类型：Object;

Undefined

Undefined类型只有一个值，即undefined.
使用var声明变量但是未进行初始化时，这个变量的值就是undefined.

Null

Null类型同样只有一个值，就是null.
null表示一个空对象指针，当定义的一个变量准备将来保存对象，那么最好将该变量初始化为null。

面试时也有遇到过undefined和null的区别或者说联系的问题，对于这个问题就可以这样回答：
实际上undefined值是派生自null值的，因此ECMA-262规定它们的相等性测试要返回true,即null == undefined //true。这就是null和undefined这两个值之间的联系，但是两者也有明显的区别。undefined的作用是当声明了一个变量但还尚未定义的时候，这个变量就默认取undefined值，但无论什么情况下都没必要将一个变量显示的设置为undefined,null则不同，只要当用于保存对象的变量还未保存对象时，都应该将其初始化为null.
*需要注意的是，虽然null == undefined的结果为true，因为两者是类似的值，但是null === undefined 的结果为false,因为两者类型不同。

Boolean

该类型有两个字面值：true和false.

Number

区别于其他语言，ECMAScript并没有为整数和浮点数分别定义数据类型，Number类型用于表示所有数值。

String

即字符串。

Object

该类型是这门语言中所有对象的基础类型。
javascript中的引用类型有：Object、Function、Date、Array、RegExp、Boolean、Number、String和自定义类等，但是所有这些引用类型都是对象，即Object。
另外在javascript高级程序设计中有这样一句话：引用类型的值（对象）是引用类型的一个实例。在ECMAScript中，引用类型是一种数据结构，用于将数据和功能组织在一起。

认识了javascript的数据类型之后，我们来看它们的类型检测问题，如何判断一个数据的类型呢？

首先我们来细数一下javascript中的数据类型，我们将它们分为两类：
基本数据类型：String,Number,Boolean,Undefined,Null;
引用类型：Function、Array、Object、Date、RegExp和自定义对象等。

下面分别介绍三种方式来判断数据类型：

typeOf()函数判断基本数据类型

对于基本数据类型，我们可以用typeOf()函数来判断类型，但有一个例外就是null，它是不能用typeOf()来判断的。

typeof(1); // number
typeof('1'); // string
typeof(true); // boolean
typeof(undefined); // boolean
typeof(null); // object
typeof(console.log); // function

可以看到执行typeof()函数可以得到六种结果，分别是number、string、boolean、oject、function，其中基本类型数据除了null都能通过typeof()得到验证，所以检测出null以外的基本函数都可以用typeof来进行类型检测。

另：为什么typeof(null)值为object?
实际上是javascript最初实现中的一个错误，然后被EAMAScript沿用了，现在null被认为是对象的占位符，从而解释了这一矛盾。

instanceof用于判断引用数据类型

typeof()函数对于基本数据类型的判断还差强人意，但是它是完全没办法用于判断引用数据类型的，因为所有引用数据类型都会返回Object。于是javascript引入了instanceof,用来判断一个变量是某个对象的实例。

var obj = {}
console.log(obj instanceof Object); // true
var arr = []
console.log(arr instanceof Array); // true
var date = new Date()
console.log(date instanceof Date); // true
var fn = function() {}
console.log(fn instanceof Function); // true
var str = '123'
console.log(str instanceof String); // false

通过以上的代码可见，instanceof对于引用类型的类型检测支持很好，但是无法对基本类型数据进行类型检测。

Object.prototype.toString.call()

在javascript高级程序设计中提供了一种可以通用的来判断基本数据类型和引用数据类型的方法。

//1、对基本数据类型num1和对基本包装类型（特殊的引用类型）num2的类型检测            
var num1 = 1;
var num2 = new Number(1);
console.log(Object.prototype.toString.call(num1) == '[Object Number]'); // true
console.log(Object.prototype.toString.call(num2) == '[Object Number]'); // true
//2、对数组的类型检测
var arr = [];
console.log(Object.prototype.toString.call(arr) == '[Object Array]') // true
//3、对函数的类型检测
var fn = function() {}
console.log(Object.prototype.toString.call(fn) == '[Object Function]') // true
//4、对自定义对象的类型检测
function A() {}
var a = new A();
console.log(Object.prototype.toString.call(a) == '[Object Object]') // true

由此可见，Object.prototype.toString.call()可以用来作为自定义类以外的数据类型检测的通用方法，而对于自定义类我们可以转而使用instanceof来进行判断。

Object.prototype.toString.call()做类型判断的结果情况如下：

字符串：'[Object String]'
数字：'[Object Number]'
布尔值：'[Object Boolean]'
undefined：'[Object Undefined]'
null：'[Object Null]'
数组：'[Object Array]'
正则表达式：'{Object RegExp}'
日期对象：'[Object Date]'

constructor属性在类型检测中的应用以及数组类型检测注意事项

constructor是Object的每个实例都存在的一个属性（再强调一遍，在ECMAScript中，Object类型是所有其他实例的基础，换句话说Object类型所具有的属性和方法也存在于更具体的对象中），该属性（constructor）保存着用于创建当前对象的函数，即该属性会返回对创建对象的构造函数的引用。

[].constructor == Array // true
{}.constructor == Object // true

需要注意的是，当用instanceof和constructor对数组进行类型检测时，被判断的Array必须是当前页面声明的：
比如一个页面（父页面）有一个框架(iframe)，框架中引用了一个页面(子页面)，在子页面中声明了一个Array，并将其赋值给父页面的一个变量，Array == Object.constructor;会返回false.
原因是：
1、Array属于引用类型数据，在传递的时候仅仅是地址的传递。
2、每个页面的Array原生对象所引用的地址是不一样的。在自页面声明的Array所对应的构造函数是子页面的Array对象。父页面进行判断使用的Array并不等于子页面的Array.