JavaScript 之 数据类型判断

1、JS的数据类型

​ 简单数据类型： String、Number、Boolean、null、undefined、Symbol

​ 复杂数据类型： Object

2、typeof

​ typeof 是一个操作符，而不是函数，可以判断变量的数据类型，一般用来判断基本数据类型的数据。它判断数据类型的原理是：JavaScript 的数据，在底层中都是以二进制的形式存储的，而二进制的最后三位表示的就是数据的类型，typeof 通过这一特点来判断数据的类型。typeof 判断数据类型返回的值有：number、string、boolean、object、function、undefined、symbol，而且都是以字符串的形式返回的。

​ 常见的：000-对象、100-字符串、110-布尔值、1xx-整数、010-浮点数。特殊的null的所有二进制机器码都是0，所以null会被typeof识别为object。Array的后三位机器码也是000，所以也会变识别为object。typeof 的缺陷就在于对null和array的数据类型判断不准确。

案例代码：

// 数字类型
typeof 37 === 'number';
typeof 3.14 === 'number';
typeof Math.LN2 === 'number';
typeof Infinity === 'number';
typeof NaN === 'number'; // 尽管NaN是非数字的意思
typeof Number(1) === 'number'; // 但不建议使用!

// 字符串类型
typeof "" === 'string';
typeof "bla" === 'string';
typeof (typeof 1) === 'string'; // typeof返回的是字符串
typeof String("abc") === 'string'; // 但不建议使用!

// 布尔类型
typeof true === 'boolean';
typeof false === 'boolean';
typeof Boolean(true) === 'boolean'; // 但不建议使用!

// Symbol类型
typeof Symbol() === 'symbol';
typeof Symbol('foo') === 'symbol';
typeof Symbol.iterator === 'symbol';

// Undefined
typeof undefined === 'undefined';
var a // 声明但未赋值
typeof a === 'undefined';
typeof b === 'undefined'; // 未声明未赋值

// 对象类型
typeof {a:1} === 'object';
typeof [1, 2, 4] === 'object'; // 数组会被判断为对象
typeof new Date() === 'object';
typeof null === 'object'; // null 也会被判断为对象

// 函数
typeof function(){} === 'function';
typeof Math.sin === 'function';

3、instanceof

​ instanceof 是一个运算符，是一种比较常用的判断引用类型数据的具体数据类型的方式，其原理是通过原型链来判断，如果右边变量的 prototype 在左边变量的原型链上，则左边变量是右边变量的实例。例如：A instanceof B，就是从当前A的 proto去一层一层的顺着原型链往上找，看看是否能找到 B.prototype，若找到了，则返回 true ，表示A是B类数据类型。

​ 但要注意的是，instanceof 仅仅用来比较来自同一个 JavaScript 上下文的自定义对象，如果用来比较属于不同 JavaScript 上下文的对象（比如，浏览器中不同的文档结构）时将会出错， 因为它们的构造函数不会是同一个对象。

​ 另外 instanceof 还可以在继承关系中用来判断一个实例是否属于它的父类型。

​ instanceof 不能判断 null 和 undefined 类型的数据。而且它判断数组、函数等数据类型属于 Object 也是成立的，所以想要判断具体的数据类型，就一定要精准的去判断，而不能用排除的方式。

// 数组
var a = [1,2,3]
console.log(a instanceof Array)  // true
console.log(a instanceof Object) // true，两者都成立
var a2 = new Array
console.log(a2 instanceof Array)  // true
console.log(a2 instanceof Object) // true

// 函数（包括箭头函数）
var b = function() {}
console.log(b instanceof Function) // true
console.log((()=>{}) instanceof Function) // true 
console.log(b instanceof Object)  // true

// 对象
var c = {}
console.log(c instanceof Object) // true
console.log(Date instanceof Object) // true

// 内置对象
var str = 'aaa'
str instanceof String // false，只能判断通过new创建的内置对象
var str = new String()
str instanceof String // true
var myDate = new Date()
myDate instanceof Date;     // true
myDate instanceof Object;   // true

// 判断继承
// foo 是否是 Foo 类的实例 , 并且是否是其父类型的实例
 function Aoo(){} 
 function Foo(){} 
 Foo.prototype = new Aoo(); //JavaScript 原型继承

 var foo = new Foo(); 
 console.log(foo instanceof Foo) // true 
 console.log(foo instanceof Aoo) // true

4、Array.isArray()

​ 该方法用来判断一个变量是否为数组类型，返回值为 true/false。

// 判断数组   
var arr = []
console.log(Array.isArray(arr)) // true

5、isNaN()

​ 该方法用来判断一个变量是否为非数字类型，返回值为 true/false。

// 判断非数字
var usrAge = 21;
console.log(isNaN(userAge)); // false ，21 不是一个非数字
var usrName = "andy";
console.log(isNaN(userName));// true ，"andy"是一个非数字

6、===

​ 我们可以通过 === 来判断 null 和 undefined。

// null
console.log(null === null) // true
// undefined
console.log(undefined === undefined) // true

7、toString()

​ toString() 是 Object 的原型方法，调用该方法，默认返回当前对象的 [[Class]] 。这是一个内部属性，其格式为 [object Xxx] ，其中 Xxx 就是对象的类型。

Object.prototype.toString.call('') ;   // [object String]
Object.prototype.toString.call(1) ;    // [object Number]
Object.prototype.toString.call(true) ; // [object Boolean]
Object.prototype.toString.call(Symbol()); //[object Symbol]
Object.prototype.toString.call(undefined) ; // [object Undefined]
Object.prototype.toString.call(null) ; // [object Null]
Object.prototype.toString.call(new Function()) ; // [object Function]
Object.prototype.toString.call(new Date()) ; // [object Date]
Object.prototype.toString.call([]) ; // [object Array]
Object.prototype.toString.call(new RegExp()) ; // [object RegExp]
Object.prototype.toString.call(new Error()) ; // [object Error]
Object.prototype.toString.call(document) ; // [object HTMLDocument]
Object.prototype.toString.call(window) ; //[object global] window 是全局对象 global 的引用