JavaScript data type detection is a common scene in our daily development. From basic data types to various reference data types detection, we need to master the knowledge points. This chapter takes a closer look at the various methods of checking data types in JavaScript and finally the ultimate method for implementing a data type check.

The ruby book tells us that the data types in JavaScript are Undefined, Null, Boolean, Number, String, and Object, among which the first five are basic types and Object is a reference type. In fact, Object contains other more specific reference types, such as Array, Function, Date, RegExp, Error, Arguments, and so on.

Throughout this chapter, I’ll use each of these 12 data types as a basis to explain the different methods of detection. (In fact, there are more than 12 data types in JavaScript, and we rarely encounter other data types, so I won’t go into details here.)

The way we usually used to detect data types, typeof and Object. The prototype. ToString, let’s take a closer look at these two methods.

typeof

The statement in MDN is that the typeof operator returns a string representing the typeof the unevaluated operand.

It is used as typeof operand or typeof(operand), where operand is an expression that represents an object or primitive value whose type will be returned in lower case as a string representing its data type.

Let’s take a look at the return values of each of the 12 data types tested using Typeof:

var und=undefined;
var nul=null;
var boo=true;
var num=1;
var str='xys'var obj=new Object(); Var arr = [1, 2, 3]; var fun=function(){}
var date=new Date();
var reg = /a/g;
var err=new Error()
var arg;
(function getArg(){ arg=arguments; }) (); console.log(typeof und); // undefined console.log(typeof nul); // object console.log(typeof boo); // boolean console.log(typeof num); // number console.log(typeof str); // string console.log(typeof obj); // object console.log(typeof arr); // object console.log(typeof fun); //function
console.log(typeof date);  // object
console.log(typeof reg);  // object
console.log(typeof err);  // object
console.log(typeof arg);  // object
Copy the code

As you can see, using the Typeof method to detect data types, most primitive types are correctly detected and return the correct string (except for the Null type, which returns the object string), Most reference types can’t be accurately detected (all but Function types return object strings).

As a result, the Typeof method does not fully detect the 12 data types in JavaScript described above.

Object.prototype.toString

ES5 specification is so describe Object. The prototype. ToString:

Can know that the Object. The prototype. ToString will eventually returns to form such as of the string of Object, class, class is refers to the detected data types, this is the key to our judgment data type.

In the same way, let’s look at the use of the Object. The prototype. The toString to detect listed above to 12 types of data will be returned to what kind of results:

var toString=Object.prototype.toString;

console.log(toString.call(und));  // [object Undefined]
console.log(toString.call(nul));  // [object Null]
console.log(toString.call(boo));  // [object Boolean]
console.log(toString.call(num));  // [object Number]
console.log(toString.call(str));  // [object String]
console.log(toString.call(obj));  // [object Object]
console.log(toString.call(arr));  // [object Array]
console.log(toString.call(fun));  // [object Function]
console.log(toString.call(date));  // [object Date]
console.log(toString.call(reg));  // [object RegExp]
console.log(toString.call(err));  // [object Error]
console.log(toString.call(arg));  // [object Arguments]
Copy the code

As you can see, the Object. The prototype. ToString returns a string Object, class, class accurately expressed various data types, and different typeof, class represents the data type of the string of the first letter is capitalized, Unlike Typeof, which returns a lower-case string.

The ultimate method of data type detection

Typeof can be used to detect basic types other than Null and Function types in reference types. And Object. The prototype. ToString can detect all of the data types, so we can combine these two methods to implement a method to detect the ultimate JavaScript data types.

/** * @desc Data type check * @param obj Data to be checked * @returnString of type {String} */function type(obj) {
  returntypeof obj ! = ="object" ? typeof obj : Object.prototype.toString.call(obj).slice(8, -1).toLowerCase();
}
Copy the code

Separate detection of data types

Sometimes we want to directly determine whether a data type is a certain type, so we can independently implement these functions to determine a certain data type, here directly gives the implementation code of each function, the need of children can be directly used.

/** * @desc Specifies whether the detection type is Undefined * @param obj Specifies the data to be detected * @return{Boolean} Indicates a Boolean value */function isUndefined(obj) {
    returnobj === void 0; } /** * @desc Whether Null type detection * @param obj data to be detected * @return{Boolean} Indicates a Boolean value */function isNull(obj) {
    returnobj === null; } /** * @desc Whether Boolean type detection * @param obj data to be detected * @return{Boolean} Indicates a Boolean value */function isBoolean(obj) {
    return typeof(obj) === 'boolean'; } /** * @desc Indicates whether the Number type is detected * @param obj Indicates the data to be detected * @return{Boolean} Indicates a Boolean value */function isNumber(obj) {
    return typeof(obj) === 'number'; } /** * @desc Whether the String type is detected * @param obj Data to be detected * @return{Boolean} Indicates a Boolean value */function isString(obj) {
    return typeof(obj) === 'string'; } /** * @desc Indicates whether the Object type is detected * @param obj Indicates the data to be detected * @return{Boolean} Indicates a Boolean value */function isObject(obj) {
    return Object.prototype.toString.call(obj) === '[object Object]'; } /** * @desc Whether to check the Array type * @param obj Data to be checked * @return{Boolean} Indicates a Boolean value */function isArray(obj){
    returnArray.isArray? Array.isArray(obj):Object.prototype.toString.call(obj) ==='[object Array]'; } /** * @desc whether Function type check * @param obj data to check * @return{Boolean} Indicates a Boolean value */function isFunction(obj){
    return typeof(obj) === 'function'; } /** * @desc Whether to check the Date type * @param obj Data to be checked * @return{Boolean} Indicates a Boolean value */function isDate(obj){
    return Object.prototype.toString.call(obj) === '[object Date]'; } /** * @desc indicates whether RegExp is detected * @param obj Indicates the data to be detected * @return{Boolean} Indicates a Boolean value */function isRegExp(obj){
    return Object.prototype.toString.call(obj) === '[object RegExp]'; } /** * @desc Is an Error type detection * @param obj Data to be detected * @return{Boolean} Indicates a Boolean value */function isError(obj){
    return Object.prototype.toString.call(obj) === '[object Error]'; } /** * @desc whether Arguments type check * @param obj data to check * @return{Boolean} Indicates a Boolean value */function isArguments(obj){
    return Object.prototype.toString.call(obj) === '[object Arguments]';
}
Copy the code