JavaScript 中常見數(shù)據(jù)類型有Number、String、Boolean、Object、Array、Json、Function、Date、RegExp、Error、undefined、Null等十幾種。ES6還有新增的數(shù)據(jù)類型有Symbol、Set、Map等。在實(shí)際應(yīng)用中，我們經(jīng)常需要判斷數(shù)據(jù)類型，現(xiàn)在我歸納幾種方法，希望對(duì)大家有所幫助。

typeof 判斷（最常用）

typeof 是 JS 提供的一個(gè)運(yùn)算符，專門用來檢測(cè)一個(gè)變量的類型 。 typeof 有2種使用方式：typeof(表達(dá)式)和typeof 變量名，第一種是對(duì)表達(dá)式做運(yùn)算，第二種是對(duì)變量做運(yùn)算。

function doSomething() { console.log(’Hello World!’);}console.log(typeof 1); // numberconsole.log(typeof ’Hello’); // stringconsole.log(typeof []); // objectconsole.log(typeof {}); // objectconsole.log(typeof doSomething); // functionconsole.log(typeof true); // booleanconsole.log(typeof new Date()); // objectconsole.log(typeof new RegExp()); // objectconsole.log(typeof JSON.stringify({ name: ’zhencanhua’})); // stringconsole.log(typeof null); // objectconsole.log(typeof undefined); // undefinedconsole.log(typeof (new Error(’error!’))); // objectconsole.log(typeof a); // undefinedconsole.log(typeof Symbol()); // symbolconsole.log(typeof new Set()); // objectconsole.log(typeof new Map()); // object

從上面打印結(jié)果可以看出，typeof 不能區(qū)分引用型數(shù)據(jù)的類型和 null。另我們可以使用 Array.isArray(arr) 將數(shù)組類型的數(shù)據(jù)從中篩選出來。

instanceof 判斷（了解）

instanceof 用來檢測(cè)構(gòu)造函數(shù)的 prototype 屬性是否出現(xiàn)在某個(gè)實(shí)例對(duì)象的原型鏈上。 語法：object（實(shí)例對(duì)象） instanceof constructor（構(gòu)造函數(shù)）。是的話返回 true，否則返回 false。所以， instanceof 運(yùn)算符只能用作對(duì)象的判斷。 針對(duì) typeof 不能判斷的引用型數(shù)據(jù)，我們可以使用 instanceof 運(yùn)算符。

let arr1 = [1, 2, 3];let obj1 = { name: ’小明’};function Persion() { }let persion1 = new Persion();console.log(arr1 instanceof Array); // trueconsole.log(arr1 instanceof Object); // true，Array 是Object的子類console.log(obj1 instanceof Object); // trueconsole.log(obj1 instanceof Array); // falseconsole.log(Persion instanceof Function, Persion instanceof Object); // true trueconsole.log(null instanceof Object); // falseconsole.log(persion1 instanceof Persion, persion1 instanceof Function, persion1 instanceof Object); // true false true// String對(duì)象和Date對(duì)象都屬于Object類型let str1 = ’Hello’;let str2 = new String();let str3 = new String(’你好’);let myDate = new Date();console.log(str1 instanceof String, str1 instanceof Object); // false, falseconsole.log(str2 instanceof String, str2 instanceof Object); // true, trueconsole.log(str3 instanceof String, str3 instanceof Object); // true, trueconsole.log(myDate instanceof Date, myDate instanceof Object); // true, true

從上面的判斷可以看出，instanceof 的使用限制很多，而且還不能很清晰方便的判斷出一個(gè)實(shí)例是數(shù)組還是對(duì)象或方法。

針對(duì)上面方法的弊端，我們可以使用 Object.prototype上的原生toString()方法來檢測(cè)數(shù)據(jù)的類型。

Object.prototype.toString.call() 判斷（最靠譜）

Object 是 JS 提供的原生對(duì)象， Object.prototype.toString對(duì)任何變量都會(huì)返回這樣一個(gè)字符串'[object class]'，class 就是 JS 內(nèi)置對(duì)象的構(gòu)造函數(shù)的名字。 call是用來改變調(diào)用函數(shù)作用域的。

Object.prototype.toString() 在toString方法被調(diào)用時(shí)執(zhí)行下面的操作步驟：

獲取this對(duì)象的[[Class]]屬性的值。（所以使用call來改變this的指向） 將字符串'[object '，第一步獲取的值, 以及 ']'拼接成新的字符串并返回。

[[Class]]是一個(gè)內(nèi)部屬性,所有的對(duì)象(原生對(duì)象和宿主對(duì)象)都擁有該屬性。在規(guī)范中，[[Class]]是這么定義的: 內(nèi)部屬性的描述， [[Class]] 是一個(gè)字符串值，表明了該對(duì)象的類型。

讀了上面的說明，用 call 的關(guān)鍵地方就在第1步，獲取的是 this 對(duì)象，不加 call 改變作用域時(shí) this 指向的是Object.prototype。

function doSomething() { console.log(’Hello World!’);}// 使用Object.prototype.toString.call來判斷console.log(Object.prototype.toString.call(1)); // [object Number]console.log(Object.prototype.toString.call(’Hello’)); // [object String]console.log(Object.prototype.toString.call(false)); // [object Boolean]console.log(Object.prototype.toString.call({})); // [object Object]console.log(Object.prototype.toString.call([1, 2, 3])); // [object Array]console.log(Object.prototype.toString.call(new Error(’error!’))); // [object Error]console.log(Object.prototype.toString.call(new Date())); // [object Date]console.log(Object.prototype.toString.call(new RegExp())); // [object RegExp]console.log(Object.prototype.toString.call(doSomething)); // [object Function]console.log(Object.prototype.toString.call(null)); // [object Null]console.log(Object.prototype.toString.call(undefined)); // [object Undefined]console.log(Object.prototype.toString.call(JSON.stringify({ name: ’zhencanhau’}))); // [object String]console.log(Object.prototype.toString.call(Math)); // [object Math]console.log(Object.prototype.toString.call(Symbol(’abc’))); // [object Symbol]console.log(Object.prototype.toString.call(new Set())); // [object Set]console.log(Object.prototype.toString.call(new Map())); // [object Map]

但在實(shí)際應(yīng)用時(shí)我們只想獲取返回的結(jié)果中數(shù)組的第二項(xiàng)，比如'[object Number]'，我們只想要Number這段字符，那么我們可以寫個(gè)函數(shù)進(jìn)行過濾：

// 通過定義一個(gè)公共函數(shù)獲取數(shù)據(jù)類型function getTypeName(val) { let str = Object.prototype.toString.call(val); return /^[object (.*)]$/.exec(str)[1];}console.log(getTypeName(false)); // Booleanconsole.log(getTypeName()); // Undefinedconsole.log(getTypeName(null)); // Null

上面的問題完美解決。

constructor 判斷（比較常用）

每一個(gè)對(duì)象實(shí)例都可以通過 constrcutor 對(duì)象來訪問它的構(gòu)造函數(shù) 。JS 中內(nèi)置了一些構(gòu)造函數(shù)：Object、Array、Function、Date、RegExp、String等。我們可以通過數(shù)據(jù)的 constrcutor 是否與其構(gòu)造函數(shù)相等來判斷數(shù)據(jù)的類型。

var arr = [];var obj = {};var date = new Date();var num = 110;var str = ’Hello’;var getName = function(){};var sym = Symbol();var set = new Set();var map = new Map();arr.constructor === Array; // trueobj.constructor === Object; // truedate.constructor === Date; // truestr.constructor === String; // truegetName.constructor === Function; // truesym.constructor === Symbol; // trueset.constructor === Set; // truemap.constructor === Map // true

但是這種方式仍然有個(gè)弊端，就是 constructor 所指向的的構(gòu)造函數(shù)是可以被修改的。

function Name(name) { this.name = name;}function Stuent(age) { this.age = age;}// 將構(gòu)造函數(shù)Name的實(shí)例賦給Student的原型，Student的原型的構(gòu)造函數(shù)會(huì)發(fā)生改變，將不再指向自身。Stuent.prototype = new Name(’張三’);Stuent.prototype.constructor === Name; // trueStuent.prototype.constructor === Stuent; // false

以上就是我在項(xiàng)目中用到過的數(shù)據(jù)類型的判斷方法，具體使用哪一種，還需要根據(jù)自己的實(shí)際需求來判斷選擇。

到此這篇關(guān)于JS數(shù)據(jù)類型判斷的幾種常用方法的文章就介紹到這了,更多相關(guān)JS 數(shù)據(jù)類型判斷內(nèi)容請(qǐng)搜索好吧啦網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持好吧啦網(wǎng)！