The way JavaScript judges the data type

The way JavaScript judges the data type

What are the data types in js?

• Basic data types: number, string, boolean, null, undefined, symbol, and the new BigInt (arbitrary precision adjustment) added by ES10 in the future.
• Reference data type: object Object, array Array, function Function

What are the methods to determine the data type?

1. The most common judgment method: typeof
2. Known object types: instanceof
3. Object prototype chain judgment method: Object.prototype.toString.call()
4. Judge according to the constructor of the object
5. jQuery method: jQuery.type()
6. Strict operator: ===

1. typeof

Note: The types returned by typeof are all in the form of strings.
Returns six strings: string, boolean, number, function, object, undefined

typeof null // object
typeof function(){
    
    } // function
typeof new Function() // function
// 基本数据类型判断
typeof 1 // 'number'
typeof 'a' // 'string'
typeof false // 'boolean'
typeof undefined // 'undefined'
typeof Symbol() // 'symbol'

// 引用数据类型判断和new关键字创建的变量判断类型
typeof {
    
    } // 'object'
typeof [] // 'object'
typeof new Number(1) // 'object'
typeof new String('a') // 'object'
typeof new Boolean(true) // 'object'
typeof new Number(1) // 'object'
typeof new Date() // 'object'
function Car () {
    
    } // 定义一个构造函数
typeof new Car() // 'object'

We can find that when typeof judges null, array, object, and function instance (new + function), all objects are obtained, which makes it impossible to get real results when judging these data types, which leads to instanceof.

two, instanceof

Note: instanceof must be followed by an object type, and the capitalization cannot be wrong.

 function Car () {
    
    } // 定义一个构造函数
 console.log(new Car() instanceof Car) // true
 console.log(new Car() instanceof Function) // false
 console.log(new Car() instanceof Object) // true
 console.log({
    
    } instanceof Object) // true
 console.log([] instanceof Array) // true
 console.log(new String('') instanceof String) // true
 console.log('' instanceof String) // false

3. Judgment method of object prototype chain: Object.prototype.toString.call()

Object.prototype.toString.call(null) // [object Null]
Object.prototype.toString.call(undefined) // [object Undefined]
Object.prototype.toString.call(1) // [object Number]
Object.prototype.toString.call(new Number(1)) // [object Number]
Object.prototype.toString.call('a') // [object String]
Object.prototype.toString.call(new String('a')) // [object String]

Object.prototype.toString.call({
    
    }) // [object Object]
Object.prototype.toString.call([]) // [object Array]
Object.prototype.toString.call(new Date()) // [object Date]
Object.prototype.toString.call(/^d$/g) // [object RegExp]
Object.prototype.toString.call(() => {
    
    }) // [object Function]
Object.prototype.toString.call(new Function()) // [object Function]

function Car () {
    
    } // 定义一个构造函数
Object.prototype.toString.call(new Car()) // [object Object]

The toString method returns the data format on the Object prototype.

Fourth, judge according to the constructor of the object

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";};　　
c.constructor === Array // true
d.constructor === Date // true
e.constructor === Function // true

The constructor's judgment method is similar to instanceof, but the constructor's detection of Object is different from instanceof. The constructor can also handle the detection of basic data types, not just object types.

Note: Null and undefined
use () when there is no constructor to judge the number, for example: (123).constructor
The constructor will make an error when class inheritance, because the Object is overwritten, and the detection result will be wrong.

Five, jQuery.type()

If the object is null or undefined, return "null" and "undefined" directly.

Note: When using, be sure to introduce the jQuery file, otherwise an error will be reported, jQuery is not defined

console.log(jQuery.type(undefined) === "undefined") // true
console.log(jQuery.type() === "undefined") // true
console.log(jQuery.type(window.notDefined) === "undefined") // true
console.log(jQuery.type(152) === "number") // true
console.log(jQuery.type('188') === "string") // true
console.log(jQuery.type([]) === "array") // true
console.log(jQuery.type(true) === "boolean") // true
console.log(jQuery.type(function(){
    
    }) === "function") // true
console.log(jQuery.type(new Date()) === "date") // true
console.log(jQuery.type(/\d/) === "regexp") // true
console.log(jQuery.type(new Error()) === "error") // true  jquery版本高于1.9.3
console.log(jQuery.type({
    
    name:'Hello'}) === "object") // true
console.log(jQuery.type(Symbol()) === "symbol") // true

6. Strict operator: ===

It is usually used to judge whether a variable is empty, whether the variable is data, etc.

var a = null;
typeof a; // 'object'
a === null; // true