Several methods of judging data type by js

  • 2021-07-10 18:44:54
  • OfStack

There are several methods to judge the data type in js: typeof, instanceof, constructor, prototype, $. type ()/jquery. type (). Next, we mainly compare the similarities and differences of these methods under 1.

Give a few examples first:


var a = "iamstring.";
var b = 222;
var c= [1,2,3];
var d = new Date();
var e = function(){alert(111);};
var f = function(){this.name="22";};    

1. The most common judgment method: typeof


alert(typeof a)  ------------> string
alert(typeof b)  ------------> number
alert(typeof c)  ------------> object
alert(typeof d)  ------------> object
alert(typeof e)  ------------> function
alert(typeof f)  ------------> function

Among them, the types returned by typeof are all in the form of strings, which should be noted, for example:


alert(typeof a == "string") -------------> true
alert(typeof a == String) ---------------> false

In addition, typeof can judge the type of function. It is convenient to judge objects except Object type.  

2. Method for judging known object type: instanceof


alert(c instanceof Array) ---------------> true
alert(d instanceof Date)
alert(f instanceof Function) ------------> true
alert(f instanceof function) ------------> false

Note: instanceof after 1 must be the object type, and the case can not be wrong, this method is suitable for 1 conditional selection or branching.   

3. Judge according to the constructor of the object: constructor

alert(c.constructor === Array) ---------- > true
alert(d.constructor === Date) ----------- > true
alert(e.constructor === Function) ------- > true

Note: constructor will have an error during class inheritance

eg:


   function A(){};
   function B(){};
   A.prototype = new B(); //A Inherit from B
   var aObj = new A();
   alert(aobj.constructor === B) -----------> true;
   alert(aobj.constructor === A) -----------> false;

The instanceof method does not have this problem, and both direct and indirect inheritance of objects will be reported to true:


   alert(aobj instanceof B) ----------------> true;
   alert(aobj instanceof B) ----------------> true;

To get down to business, solving the problem of construtor is usually to let the object's constructor point to itself manually:


   aobj.constructor = A; // Assign your own class to the object's constructor Attribute 
   alert(aobj.constructor === A) -----------> true;
   alert(aobj.constructor === B) -----------> false; // The base class does not report true It's over ;

4. General but cumbersome method: prototype


alert(Object.prototype.toString.call(a) ===  ' [object String]') -------> true;
alert(Object.prototype.toString.call(b) ===  ' [object Number]') -------> true;
alert(Object.prototype.toString.call(c) ===  ' [object Array]') -------> true;
alert(Object.prototype.toString.call(d) ===  ' [object Date]') -------> true;
alert(Object.prototype.toString.call(e) ===  ' [object Function]') -------> true;
alert(Object.prototype.toString.call(f) ===  ' [object Function]') -------> true;

You can't write the wrong case, which is troublesome, but it is better than general use.

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]] identical, we return the corresponding [[Class]] name. (For more details on this technology. )


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".

Usually, it is enough to judge with typeof. If you can predict the type of Object, you can choose instanceof or constructor. If you can't help it, you can use $. type () method.


Related articles: