一、媒介
范例推断有时刻真的头疼，然则一旦闇练运用就会以为不过如此。低级的，会推断数字和字符串。中级的，会推断数组和对象。进阶的，会推断日期，正则，毛病范例。高等的，会推断plainObject，空对象，window对象等等。
基础范例：String、Number、Boolean、Symbol、Undefined、Null
援用范例：Object
基础范例也称为简朴范例，由于其占有空间牢固，是简朴的数据段，为了便于提拔变量查询速率，将其存储在栈中，即按值接见。
援用范例也称为庞杂范例，由于其值的大小会转变，所以不能将其存放在栈中，不然会下降变量查询速率，因而，其值存储在堆(heap)中，而存储在变量处的值，是一个指针，指向存储对象的内存处，即按址接见。援用范例除 Object 外，还包括 Function 、Array、RegExp、Date 等等。
鉴于 ECMAScript 是松懈范例的，因而须要有一种手腕来检测给定变量的数据范例。关于这个题目，JavaScript 也供应了多种要领，但遗憾的是，差别的要领获得的效果良莠不齐。
二、typeof
typeof是最常常用到的推断范例的。
typeof('saucxs') //'string'
typeof 'saucxs' //'string'
typeof function(){console.log('saucxs')} //'function'
typeof ['saucxs','songEagle',1,2,'a'] //'object'
typeof {name: 'saucxs'} //'object'
typeof 1 //'number'
typeof undefined //'undefined'
typeof null //'object'
typeof /^\d/ //'object'
typeof Symbol // 'function'实在，typeof是一个运算符，和加减乘除相似，这就是为啥可以如许写 typeof ‘saucxs’。
在《JavaScript威望指南》中对typeof的引见：typeof是一元操纵符，放在单个操纵数的前面，操纵数可以是恣意范例。返回值示意操纵数的范例的一个字符串。
JavaScript中一共有6中基础数据范例：string，number，boolean，null，undefined，symbol，一种对象范例：object。
离别对应的typeof的值，效果不是一一对应的，离别：string，number，boolean，object，undefined，function，对象范例：object。
注重：typeof 可以检测函数范例
然则在object下另有许多细分内部属性：Array，Function，Date，RegExp，Error等。
var date = new Date();
var error = new Error();
console.log(typeof date); // object
console.log(typeof error); // object所以还须要更好的辨别。
三、instanceof
运用instanceof的前提前提：object instanceof constructor。object–要检测的对象。constructor–某个组织函数。申明运用这个instanceof必需是用来检测对象的的范例，不能检测其他范例。
A instanceof B用来推断A是不是为B的实例。假如A是B的实例，则返回true，不然false。
道理：instanceof是检测原型。
instanceof (a,B) = {
var l = a.__proto__;
var R = B.prototype;
if(l === R) {
// a的内部属性 __proto__ 指向 B 的原型对象
return true;
}
return false;
}剖析：a的_proto_指向B的prototype时，a就是B的实例。
[] instanceof Array //true
[] instanceof Object //true
new Array([1,43,6]) instanceof Array // true
new Array([1,43,6]) instanceof Object // true
{} instanceof Object // 原型上没有定义 Uncaught SyntaxError: Unexpected token instanceof
({}) instanceof Object; //true
Object.create({'name': 'saucxs'}) instanceof Object //true
Object.create(null) instanceof Object //false 一种建立对象的要领，这类要领建立的对象不是Object的一个实例
new Date() instanceof Date //true
new Date() instanceof Object //true
'saucxs' instanceof Object //false
'saucxs' instanceof String //false
new String("saucxs") instanceof Object //true
new String("saucxs") instanceof String //true
1 instanceof Object //false
1 instanceof Number //false
new Number(1) instanceof Object //true
new Number(1) instanceof Number //true
true instanceof Object //false
true instanceof Boolean //false
new Boolean(true) instanceof Object //true
new Boolean(true) instanceof Boolean //true
null instanceof Object //false
undefined instanceof Object //false
Symbol() instanceof Symbol //false注重：1、new Date对象既属于Object，又属于Date。（他们是由Object类派生出来的）。
2、用字面量建立的数组或许组织函数建立的数组，既属于Object，又属于Array。
3、用对象字面量建立的对象object 会报错， {} instanceof Object；运用组织函数建立的对象属于Object。
4、用字面量的建立的字符串，数字，布尔，既不属于Object，也不属于各自范例；只要运用组织函数建立的字符串，数字，布尔，既属于Object，又属于各自的范例。
发明[]，组织函数建立的Date，Object，String，Number，Boolean。既属于自身，又属于Object。
举个例子，[], Array, Object的关联：
从 instanceof 可以推断出 [ ].__proto__ 指向 Array.prototype，而 Array.prototype.__proto__ 又指向了Object.prototype，终究 Object.prototype.__proto__ 指向了null，标志着原型链的完毕。因而，[]、Array、Object 就在内部构成了一条原型链：
从原型链可以看出，[] 的 proto 直接指向Array.prototype，间接指向 Object.prototype，所以依据 instanceof 的推断划定规矩，[] 就是Object的实例。顺次类推，相似的 new Date()、new Person() 也会构成一条对应的原型链 。因而，instanceof 只能推断两个对象是不是属于实例关联， 而不能推断一个对象实例详细属于哪一种范例。
存在的题目：
它假定只要一个全局实行环境。假如网页中包括多个框架，那实际上就存在两个以上差别的全局实行环境，从而存在两个以上差别版本的组织函数。假如你从一个框架向另一个框架传入一个数组，那末传入的数组与在第二个框架中原生建立的数组离别具有各自差别的组织函数。
var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
xArray = window.frames[0].Array;
var arr = new xArray(1,2,3); // [1,2,3]
arr instanceof Array; // false针对数组题目，ES5 供应了 Array.isArray() 要领 。该要领用以确认某个对象自身是不是为 Array 范例。
if (Array.isArray(value)){
//对数组实行某些操纵
}Array.isArray() 本质上检测的是对象的 [[Class]] 值，[[Class]] 是对象的一个内部属性，内里包括了对象的范例信息，其花样为 [object Xxx] ，Xxx 就是对应的详细范例 。关于数组而言，[[Class]] 的值就是 [object Array] 。
四、constructor
定义一个组织函数Func()，JS引擎会给Func增加prototype原型，然后再给prototype上增加一个constructor属性，而且指向Func的援用。
实例化一个函数func，var func = new Func()。此时Func原型上的constructor通报到func上，因而func.constructor === Func。
Func应用原型对象上的constructor援用自身，当Func作为组织函数来建立实例化对象时，原型上的constructor就会遗传到新建立的对象上。从原型链角度讲，组织函数Func就是新对象的func的范例。如许存在的意义就是新对象发生以后，可以追踪数据范例。
JavaScript 中的内置对象在内部构建时也是如许做的：
'saucxs'.constructor === String //true
new String('saucxs').constructor === String //true
[].constructor === Array //true
new Array([12,56]).constructor === Array //true
new Number(12).constructor === Number //true
new Function(console.log('saucxs')).constructor === Function //true
new Date().constructor === Date //true
new Error().constructor === Error //true
window.constructor === Window //true
document.constructor === HTMLDocument //true注重：
（1） null 和 undefined 是无效的对象，因而是不会有 constructor 存在的，这两种范例的数据须要经由过程其他体式格局来推断。
（2）函数的 constructor 是不稳定的，这个重要体现在自定义对象上，当开辟者重写 prototype 后，原有的 constructor 援用会丧失，constructor 会默以为 Object
为何变成了 Object？
由于 prototype 被从新赋值的是一个 { }， { } 是 new Object() 的字面量，因而 new Object() 会将 Object 原型上的 constructor 通报给 { }，也就是 Object 自身。
因而，为了范例开辟，在重写对象原型时平常都须要从新给 constructor 赋值，以保证对象实例的范例不被改动。
五、Object.prototype.toString
toString() 是 Object 的原型要领，挪用该要领，默许返回当前对象的 [[Class]] 。这是一个内部属性，其花样为字符串 [object xxx] ，个中 xxx 就是对象的范例。
这个要领究竟是个啥？可以 先看ES5 范例地点：https://es5.github.io/#x15.2.4.2
toString要领被挪用的时刻，会依据这个步骤实行：
（1）假如this的值是undefined，就返回[object Undefined];
（2）假如this的值是null，就返回[object Null];
（3）让O成为ToObject(this)的效果；
（4）让class成为O的内部属性[[class]]的值；
（5）末了返回由”[object” 和 class 和 “]”三个部份构成的字符串。
一句话就是：挪用Object.prototype.toString 会返回一个”[object” 和 class 和 “]”构成的字符串，而class要推断对象的内部属性。
console.log(Object.prototype.toString.call(undefined)) // '[object Undefined]'
console.log(Object.prototype.toString.call(null)) // '[object Null]'
console.log(Object.prototype.toString.call(Window)) // '[object Function]'
var date = new Date();
console.log(Object.prototype.toString.call(date)) // '[object Date]'
console.log(Object.prototype.toString.call(Symbol)) // '[object Function]'注重：经由过程call转变this的指向。
所以这个class的值是辨认对象范例的症结，所以运用Object.prototype.toString要领辨认出更多的范例，可以辨认出最少11种范例
var number = 1; // [object Number]
var string = '123'; // [object String]
var boolean = true; // [object Boolean]
var und = undefined; // [object Undefined]
var nul = null; // [object Null]
var obj = {a: 1} // [object Object]
var array = [1, 2, 3]; // [object Array]
var date = new Date(); // [object Date]
var error = new Error(); // [object Error]
var reg = /a/g; // [object RegExp]
var func = function a(){}; // [object Function]
Math //[object Math]
JSON //[object JSON]注重：
1、实在Math对象和JSON对象，并不会去推断；
2、Math对象并不像Date和String那样对象的类，没有组织函数Math(), Math.sin()如许的只是函数，不是某一个对象的要领。
六、研讨jquery的type API
运用Object.prototype.toString这个要领，推断各种范例就比较轻松了，参考了jquery的源码的type部份：
function type(obj) {
// 一举两得
if (obj == null) {
return obj + "";
}
return typeof obj === "object" || typeof obj === "function" ?
class2type[Object.prototype.toString.call(obj)] || "object" :
typeof obj;
}个中class2type部份
var class2type = {};
// 天生class2type映照
"Boolean Number String Function Array Date RegExp Object Error".split(" ").map(function(item, index) {
class2type["[object " + item + "]"] = item.toLowerCase();
})运用：
type(1); //'number'
type('123456'); //'string'
type(true); //boolean
type(undefined); //undefined
type(null); //'null'
type({name: 'saucxs'}); //'object'
type([1,2,'saucxs',3,4]); //'array'
type(new Date()); // 'date'
type(new Error()); //'error'
type(/^\d/); //'regexp'
type(function(){console.log('saucxs')}); //'function'
type(Symbol); //'function'这就异常圆满的完成了，对我们一样平常须要范例的推断。
完成了推断日期，正则，毛病范例等。
假如还须要推断比较庞杂的，比方：空对象，window对象，类数组对象等等。
七、空对象EmptyObject
jQuery供应了 isEmptyObject 要领来推断是不是是空对象
function isEmptyObject( obj ) {
var name;
for ( name in obj ) {
return false;
}
return true;
}思绪：推断空对象就是推断是是不是有属性值，for轮回一旦实行，就申明有属性，有属性返回false。
console.log(isEmptyObject({})); // true
console.log(isEmptyObject([])); // true
console.log(isEmptyObject(null)); // true
console.log(isEmptyObject(undefined)); // true
console.log(isEmptyObject(123)); // true
console.log(isEmptyObject('')); // true
console.log(isEmptyObject(true)); // true这个推断重要用来区分 {} 和 {name: ‘saucxs’} 就行。
注重点：（1）for in 是ES6的属性，这个会遍历原型上的属性。（2）运用Object.keys(obj)是ES5的属性，不会遍历原型上的属性
八、window对象
window对象是客户端js的全局对象，他有一个window属性指向自身。依据这个特征推断是不是为window对象。
function isWindow(obj){
return obj != null && obj ===obj.window;
}注重：一个一般对象具有 window 属性，而且指向自身。比方这个：
function isWindow( obj ) {
return obj != null && obj === obj.window;
}
let fakeWindow = {}
fakeWindow.window = fakeWindow
isWindow(fakeWindow) // true是不是是可以这么修正呢？
function isWindow(obj) {
return !!(window && obj === window)
}九、类数组对象
假如对类数组没有观点，举个例子：
1、数组和类数组
var arr = [,,3];对应的类数组是
var arrLike = {
2: 3,
length: 3
}看jquery的源码
function isArrayLike(obj) {
// obj 必需有 length属性
var length = !!obj && "length" in obj && obj.length;
var typeRes = type(obj);
// 排撤除函数和 Window 对象
if (typeRes === "function" || isWindow(obj)) {
return false;
}
return typeRes === "array" || length === 0 ||
typeof length === "number" && length > 0 && (length - 1) in obj;
}所以假如 isArrayLike 返回true，最少要满足三个前提之一：
（1）是数组
（2）长度为 0
（3）lengths 属性是大于 0 的数字范例，而且obj[length – 1]必需存在
第三个前提：数组顶用逗号直接跳过的时刻，我们以为该元素是不存在的，类数组对象中也就不必写这个元素，然则末了一个元素是肯定要写的，要不然 length 的长度就不会是末了一个元素的 key 值加 1。比方数组可以如许写
var arr = [1,,];
console.log(arr.length) // 2改写成类数组
var arrLike = {
0: 1,
length: 1
}所以相符前提的类数组对象是肯定存在末了一个元素的！
十、推断是不是是dom元素
isElement 推断是不是是 DOM 元素。
isElement = function(obj) {
return !!(obj && obj.nodeType === 1);
};十一、总结
推断范例重要时四个要领：（1）typeof；（2）instanceof；（3）constructor；（4）Object.prototype.toString()。
从基础的六种范例推断，可以运用typeof，假如涉及到对象的内部范例时刻；还可以运用instanceof，检测对象原型的；还可以运用constructor属性是不是是指向他们组织函数；须要运用Object.prototype.toString()，假如须要推断空对象，可以运用ES6 的 for in 来推断，用window属性指向自身来推断是不是是window对象。以及类数组对象的推断，以及推断是不是是dom元素的推断。
