有五種資料判斷型別方法typeof 、instanceof、constructor、Object.prototype.toString.call()、jquery.type()

一、typeof方法

typeof是個操作符，可以判斷基本資料型別（返回的結果只能是number，string，boolean，null，symbol，function，object）
返回值分以下幾種
對於基本型別。除了null值返回object以外，其他均返回正確的結果
對於引用值來說，除了function返回function型別，其他都返回object型別
例：

console.log(
 typeof 100,//"number"
 typeof 'abc',//"string"
 typeof false,//"boolean"
 typeof undefined,//"undefined"
 typeof null,//"object"
 typeof [1,2,3],//"object"
 typeof {a:1,b:2,c:3},//"object"
 typeof function(){console.log('aaa');},//"function"
 typeof new Date(),//"object"
 typeof /^[a-zA-Z]{5,20}$/,//"object"
 typeof new Error() //"object"
 typeof new Number(100),//'object'
 typeof new String('abc'),// 'string'
 typeof new Boolean(true),//'boolean'
)

二、instanceof方法

一般用來檢測引用資料型別，表示式為：A instanceof B，判斷A是否是B的例項，如果 A 是 B 的例項，則返回 true,否則返回 false，由構造型別判斷出資料型別

console.log(
 100 instanceof Number,//false
 'dsfsf' instanceof String,//false
 false instanceof Boolean,//false
 undefined instanceof Object,//false
 null instanceof Object,//false
 [1,3] instanceof Array,//true
 {a:1,c:3} instanceof Object,//true
 function(){console.log('aaa');} instanceof Function,//true
 new Date() instanceof Date,//true
 /^[a-zA-Z]{5,20}$/ instanceof RegExp,//true
 new Error() instanceof Error //true
)
//注意： instanceof 後面一定要是物件型別，大小寫不能寫錯，該方法試用一些條件選擇或分支

還需要注意null和undefined都返回了false，這是因為它們的型別就是自己本身，並不是Object創建出來它們，所以返回了false。

三、constructor方法

constructor是prototype物件上的屬性，指向建構函式，

var num = 123;
var str = 'abcdef';
var bool = true;
var arr = [1,3,4];
var json = {name:'wenzi',age:25};
var func = function(){ console.log('this is function'); }
var und = undefined;
var nul = null;
var date = new Date();
var reg = /^[a-zA-Z]{5,20}$/;
var error= new Error();

function Person(){
 
}
var tom = new Person();

// undefined和null沒有constructor屬性
console.log(
 tom.constructor==Person,num.constructor==Number,str.constructor==String,bool.constructor==Boolean,arr.constructor==Array,json.constructor==Object,func.constructor==Function,date.constructor==Date,reg.constructor==RegExp,error.constructor==Error
);
//所有結果均為true

注意：除了undefined和null之外，其他型別都可以通過constructor屬性來判斷型別

方法四：Object.prototype.toString 方法

用來檢測物件型別

var toString = Object.prototype.toString;

toString.call(123); //"[object Number]"
toString.call('abcdef'); //"[object String]"
toString.call(true); //"[object Boolean]"
toString.call([1,4]); //"[object Array]"
toString.call({name:'wenzi',age:25}); //"[object Object]"
toString.call(function(){ console.log('this is function'); }); //"[object Function]"
toString.call(undefined); //"[object Undefined]"
toString.call(null); //"[object Null]"
toString.call(new Date()); //"[object Date]"
toString.call(/^[a-zA-Z]{5,20}$/); //"[object RegExp]"
toString.call(new Error()); //"[object Error]"

toString是Object原型物件上的一個方法，該方法預設返回其呼叫者的具體型別更嚴格的講，是 toString執行時this指向的物件型別,返回的型別格式為[object,xxx],xxx是具體的資料型別，其中包括：String，Number，Boolean，Undefined，Null，Function，Date，Array，RegExp，Error，HTMLDocument等等都可以通過這個方法獲取到

5、無敵萬能的方法：jquery.type()

如果物件是undefined或null，則返回相應的“undefined”或“null”。

jQuery.type( undefined ) === "undefined"
jQuery.type() === "undefined"
jQuery.type( window.notDefined ) === "undefined"
jQuery.type( null ) === "null"

如果物件有一個內部的[[Class]]和一個瀏覽器的內建物件的 [[Class]] 相同，我們返回相應的 [[Class]] 名字

jQuery.type( true ) === "boolean"
jQuery.type( 3 ) === "number"
jQuery.type( "test" ) === "string"
jQuery.type( function(){} ) === "function"
jQuery.type( [] ) === "array"
jQuery.type( new Date() ) === "date"
jQuery.type( new Error() ) === "error" // as of jQuery 1.9
jQuery.type( /test/ ) === "regexp"

其他一切都將返回它的型別“object”。
6 . 自己也可以封裝一個獲取變數準確型別的函式

function gettype(obj) {
 var type = typeof obj;

 if (type !== 'object') {
 return type;
 }
 //如果不是object型別的資料，直接用typeof就能判斷出來

 //如果是object型別資料，準確判斷型別必須使用Object.prototype.toString.call(obj)的方式才能判斷
 return Object.prototype.toString.call(obj).replace(/^\[object (\S+)\]$/,'$1');
}

總結

到此這篇關於JavaScript判斷資料型別有幾種方法及區別介紹的文章就介紹到這了,更多相關js 判斷資料型別內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們！