JavaScript Judgment Data Type Several Methods and Difference Introduction
- 2021-08-10 06:42:09
- OfStack
There are five methods for judging data types: typeof, instanceof, constructor, Object. prototype. toString. call (), jquery. type ()
1. typeof method
typeof is an operator that determines the basic data type (only number, string, boolean, null, symbol, function, object can be returned)
The return values are divided into the following types
For basic types. All return correct results except that the null value returns object
For reference values, object type is returned except function which returns function type
Example:
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'
)
2. instanceof method
The expression is: A instanceof B, judging whether A is an instance of B, if A is an instance of B, returning true, otherwise returning false, judging the data type by the construction type
console.log(
100 instanceof Number, //false
'dsfsf' instanceof String, //false
false instanceof Boolean, //false
undefined instanceof Object, //false
null instanceof Object, //false
[1,2,3] instanceof Array, //true
{a:1,b:2,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
)
// Note: instanceof Back 1 It must be an object type, and the case can't be wrong. Try this method 1 Some conditional selection or branching
Also note that both null and undefined return false, because their type is themselves, and false is not created by Object, so false is returned.
3. constructor method
constructor is a property on an prototype object that points to the constructor,
var num = 123;
var str = 'abcdef';
var bool = true;
var arr = [1, 2, 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 And null No constructor Attribute
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
);
// All results are true
Note: Except for undefined and null, other types can be judged by the constructor attribute
Method 4: Object. prototype. toString method
Used to detect object types
var toString = Object.prototype.toString;
toString.call(123); //"[object Number]"
toString.call('abcdef'); //"[object String]"
toString.call(true); //"[object Boolean]"
toString.call([1, 2, 3, 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 is a method on the prototype object of Object, which returns the specific type of its caller by default. More strictly speaking, it is the object type pointed by this when toString is running, and the returned type format is [object, xxx]. xxx is the specific data type, including String, Number, Boolean, Undefined, Null, Function, Date, Array, RegExp, Error, HTMLDocument and so on
5. Invincible and omnipotent method: jquery. type ()
If the object is undefined or null, the corresponding "undefined" or "null" is returned.
jQuery.type( undefined ) === "undefined"
jQuery.type() === "undefined"
jQuery.type( window.notDefined ) === "undefined"
jQuery.type( null ) === "null"
If the object has 1 internal [[Class]] and 1 browser's built-in object [[Class]], we return the corresponding [[Class]] name
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"
All other 1 cuts will return its type "object".
6. You can also encapsulate a function to get the exact type of variable yourself
function gettype(obj) {
var type = typeof obj;
if (type !== 'object') {
return type;
}
// If not object Type of data, directly use typeof You can tell
// If it is object Type data, which must be used to accurately judge the type Object.prototype.toString.call(obj) The way to judge
return Object.prototype.toString.call(obj).replace(/^\[object (\S+)\]$/, '$1');
}
Summarize