摘要:不管是什么類型的,Object.prototype.toString.call();都可以判斷出其具體的類型,簡單基本類型(String、Number、Boolean、Null、Undefined)不是對象,復雜基本類型都為對象子類型,函數是特殊的對象子類型(可調用對象)
數據類型分為基本類型和引用類型:
基本類型:String、Number、Boolean、Null、Undefined、symbol(ES6)
引用類型:Object、Array、Date、Function、Error、RegExp、Math、Number、String、Boolean、Globle。
js內置類型有七種:String、Number、Boolean、Null、Undefined、Symbol(ES6)、Object
判斷數據類型的方法一般可以通過:typeof、instanceof、constructor、Object.prototype.toString.call();四種常用方法
1、typeof:(可以對基本類型(包括function)做出準確的判斷,但對于引用類型,用它就有點力不從心了)
typeof 返回一個表示數據類型的字符串,返回結果包括:number、boolean、string、object、undefined、function、Symbol6種數據類型。
對于引用類型,返回的都是object,其實返回object也沒有錯,因為所有對象的原型鏈最終都指向了Object,Object是所有對象的`祖宗`。 但當我們需要知道某個對象的具體類型時,typeof 就顯得有些力不從心了。
注意:typeof null也是返回object,這是一個bug因為不同的對象在底層都是二進制存儲,js中二進制前三位為0的話會被判斷為object類型,而null的二進制都是0,造成誤判。
2、instanceof(判斷是否是某個類的實例)
判斷對象和構造函數在原型鏈上是否有關系,如果有關系,返回真,否則返回假
function Aaa(){}var a1 = new Aaa();console.log( a1 instanceof Aaa); //true判斷a1和Aaa是否在同一個原型鏈上,是的話返回真,否則返回假var arr = [];console.log( arr instanceof Aaa);//false
我們來看一下
var str = 'hello'; alert(str instanceof String);//false var bool = true; alert(bool instanceof Boolean);//false var num = 123; alert(num instanceof Number);//false var nul = null; alert(nul instanceof Object);//false var und = undefined; alert(und instanceof Object);//false var oDate = new Date(); alert(oDate instanceof Date);//true var json = {}; alert(json instanceof Object);//true var arr = []; alert(arr instanceof Array);//true var reg = /a/; alert(reg instanceof RegExp);//true var fun = function(){}; alert(fun instanceof Function);//true var error = new Error(); alert(error instanceof Error);//true
從上面的運行結果我們可以看到,基本數據類型是沒有檢測出他們的類型,但是我們使用下面的方式創建num、str、boolean,是可以檢測出類型的:
var num = new Number(123);var str = new String('abcdef');var boolean = new Boolean(true);console.log(num instanceof Number)console.log(num instanceof String)
3、constructor:查看對象對應的構造函數
constructor 在其對應對象的原型下面,是自動生成的。當我們寫一個構造函數的時候,程序會自動添加:構造函數名.prototype.constructor = 構造函數名
function Aaa(){}//Aaa.prototype.constructor = Aaa; //每一個函數都會有的,都是自動生成的 //Aaa.prototype.constructor = Aaa;
判斷數據類型的方法
var str = 'hello'; alert(str.constructor == String);//true var bool = true; alert(bool.constructor == Boolean);//true var num = 123; alert(num.constructor ==Number);//true // var nul = null; // alert(nul.constructor == Object);//報錯 //var und = undefined; //alert(und.constructor == Object);//報錯 var oDate = new Date(); alert(oDate.constructor == Date);//true var json = {}; alert(json.constructor == Object);//true var arr = []; alert(arr.constructor == Array);//true var reg = /a/; alert(reg.constructor == RegExp);//true var fun = function(){}; alert(fun.constructor ==Function);//true var error = new Error(); alert(error.constructor == Error);//true
從上面的測試中我們可以看到,undefined和null是不能夠判斷出類型的,并且會報錯。因為null和undefined是無效的對象,因此是不會有constructor存在的
同時我們也需要注意到的是:使用constructor是不保險的,因為constructor屬性是可以被修改的,會導致檢測出的結果不正確
function Aaa(){}Aaa.prototype.constructor = Aaa;//程序可以自動添加,當我們寫個構造函數的時候,程序會自動添加這句代碼function BBB(){}Aaa.prototype.constructor = BBB;//此時我們就修改了Aaa構造函數的指向問題alert(Aaa.construtor==Aaa);//false
可以看出,constructor并沒有正確檢測出正確的構造函數
備注:使用Object.create()創建的js對象,沒有constructor
null和undefined沒有相應的構造形式,而Date,只有相應的構造形式而沒有文字形式兩者相反
4、Object.prototype.toString(可以說不管是什么類型,它都可以立即判斷出)
簡單原理為:子類型在內部借用了object中的tostring()方法
toString是Object原型對象上的一個方法,該方法默認返回其調用者的具體類型,更嚴格的講,是 toString運行時this指向的對象類型, 返回的類型
格式為[object xxx],xxx是具體的數據類型,其中包括:
String,Number,Boolean,Undefined,Null,Function,Date,Array,RegExp,Error,HTMLDocument,... 基本上所有對象的類型都可以通過這個方法獲取到。
var str = 'hello'; console.log(Object.prototype.toString.call(str));//[object String] var bool = true; console.log(Object.prototype.toString.call(bool))//[object Boolean] var num = 123; console.log(Object.prototype.toString.call(num));//[object Number] var nul = null; console.log(Object.prototype.toString.call(nul));//[object Null] var und = undefined; console.log(Object.prototype.toString.call(und));//[object Undefined] var oDate = new Date(); console.log(Object.prototype.toString.call(oDate));//[object Date] var json = {}; console.log(Object.prototype.toString.call(json));//[object Object] var arr = []; console.log(Object.prototype.toString.call(arr));//[object Array] var reg = /a/; console.log(Object.prototype.toString.call(reg));//[object RegExp] var fun = function(){}; console.log(Object.prototype.toString.call(fun));//[object Function] var error = new Error(); console.log(Object.prototype.toString.call(error));//[object Error]
從這個結果也可以看出,不管是什么類型的,Object.prototype.toString.call();都可以判斷出其具體的類型。
接下來我們分析一下四種方法各自的優缺點
例:跨頁面判斷是否是數組
window.onload = function(){ var oF = document.createElement('iframe'); document.body.appendChild( oF ); var ifArray = window.frames[0].Array; var arr = new ifArray(); //alert( arr.constructor == Array ); //false //alert( arr instanceof Array ); //false alert( Object.prototype.toString.call(arr) == '[object Array]' ); //true };
從結果中可以看出,constructor和instanceof都沒有正確的判斷出類型,只有object.prototype.toString.call();正確判斷出了
其實面試官也經常喜歡讓說一種最簡單的判斷是數組的方法,記住嘍是object.prototype.toString.call()哦!