SoFunction
Updated on 2025-03-10

How to detect various types of JavaScript

1. First introduce the 5 original types

5 primitive types in JavaScript arestringnumberbooleanundefinednull

var name = "Jack";
var age = 32;
var single = false;
var app;  //undefined

(typeof name);  //string
(typeof age);  //number
(typeof single); //boolean
(typeof app);  //undefined
(typeof null);  //object

DiscoverExcept nullAll other 4 basic types can be usedtypeofTo identify:

if(typeof name === "string") { name += "Zhang"; }
if(typeof age === "number") { age++; }
if(typeof single === "boolean" && single) { … }
if(typeof app === "undefined") { app = {}; }

Because typeof null will get object, use === to detect null directly:

if(el === null) { … }

2. Object

JavaScript objects include built-in objects (Date,RegExp ,Erroretc.) andCustom Objects

(Note that although Function and Array are also built-in objects, they are discussed separately in the next section)

Objects cannot be used like basic typestypeofCome to test, because the results areobject

(typeof new Date());  //object
(typeof new RegExp()); //object
(typeof new Error());  //object
(typeof new Person()); //usetypeofIt's also true that a custom object is detectedobject

To use instanceof instead to detect:

var date = new Date();
var reg = new RegExp();
var err = new Error();
var me = new Person();

if(date instanceof Date) {  //Date  year = (); 
}
if(reg instanceof RegExp) {  //Detection of regular expressions  (...); 
}
if(err instanceof Error) {  //Detection of abnormalities  throw err; 
}
if(me instanceof Person) {  //Detection of custom objects  ... 
}

But there is a problem with custom objects, assuming that Person is defined in both frameA and frameB of the browser. The me object is defined in frameA,me instanceof PersonDetected to true. But when the custom object me is passed to frameB, instanceof will be false in frameB.

As mentioned at the beginning of this section, although Function and Array are also built-in objects, they are left to the next section. The reason is that Function and Array also have the same above problems as custom objects. Therefore, Function and Array generally do not use instanceof

3. Function

The above said that using instanceof detection function cannot cross frames. Therefore, typeof is used to detect, which can be cross-frame:

var func = function(){};
if(typeof func === 'function') { … }

However, IE8 used typeof to detect DOM functions and would get an object, so IE8 used in:

(typeof );    //object, not function(typeof ); //object, not function(typeof );     //object, not function
//In IE browsers before IE8, you should use in instead to detect whether they support DOM functions.if("getElementById" in document) { … }    
if("getElementsByTagName" in document) { … }
if("createElement" in document) { … }

4. Array

The above said that using instanceof to detect that Array cannot cross frames. Before ES5, we have customized detection methods. The most accurate method:ToString that depends on Array will return the fixed string "[Object Array]" to detect

function isArray(arr) {
  return (arr) === "[Object Array]";
}

This method is precise and elegant, so it was adopted by many libraries. Finally, Array was introduced as an isArray method in ES5, referring to MDN. Now you don't need to customize the detection method, just use itisArray()Just do it.

Other detection methods have their own defects and cannot be 100% accurate. But as a way of thinking, it can be learned from it. For example, relying on the fact that Array is the only object containing the sort method is detected:

function isArray(arr) {
  return typeof  === "function";
}

If the sort method is also defined for a custom object, the method will be invalid.

V. Attributes

Detect whether attributes should be used in instance objectshasOwnProperty. If you don't care whether the attribute is in an instance object or in a prototype object, you can simply use in

For example, detect literal object properties:

var Person = {
  name: "Jack",
  age: 33
};
if("name" in Person) { … }         //true
if(("name")) { … }  //true

For example instance object properties:

var Person = function (name, age) {
   = name;
   = age;
};
 = "Shanghai";

var me = new Person("Jack", 33)
if("name" in me) { … }         //true
if(("name")) { … }  //true
if("location" in me) { … }       //true
if(("location")) { … }//false

Other methods are not good:

if (object[propName])      //Not Good, how do you know that the attribute value is not 0 or 1?if (object[propName] === null)    //Not Good, how do you know that the attribute value is not null?if (object[propName] === undefined)  //Not Good,How do you know that the attribute value is notundefined?

Summarize

Use typeof to detect string, number, boolean, undefined, function

Detect null with ===

Detect Array with isArray()

Use instanceof to detect built-in objects (except Function and Array) and custom objects

Use hasOwnProperty to detect whether the property is in the instance object. If you don't care whether the attribute is in an instance object or in a prototype object, you can simply use in

Okay, that's all for this article about how to detect various types of JavaScript. I hope everyone can study the content of this article carefully, which may be helpful for everyone to learn JavaScript.