1. First introduce the 5 original types
5 primitive types in JavaScript arestring,number,boolean,undefined,null
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 Person
Detected 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.