Javascript type judgment

Keywords: Javascript Front-end ECMAScript

Basic types of JS

There are seven basic types of JS: bigInt (bigInt is a built-in object and the second built-in type other than symbol), number, string, boolean, symbol, undefined and null. Complex data types include objects, including basic objects, functions, arrays, and built-in objects (Date, etc.).

Method of judging type

Method 1. typeof method
The basic data type returns the string of the corresponding type except null.

typeof 1 // "number" 
typeof 'a'  // "string"
typeof true  // "boolean"
typeof undefined // "undefined"
typeof Symbol() // "symbol"
typeof 42n // "bigint"

Note: whether a variable is declared can be judged by (typeof variable = = = "undefined")

null returns "object"

typeof null  // "object"

Because of historical reasons. Typeof null failed to return null, so remember that typeof null returns object.
The special value NaN returns "number"

typeof NaN // "number"

In complex data types, "object" is returned except for "function"

typeof({a:1}) // "Object" ordinary object returns "object" directly
typeof [1,3] // Array returns "object"
typeof(new Date) // Built in object "object"

Function returns "function"

typeof function(){} // "function"

Therefore, we can find that typeof can judge basic data types, but it is difficult to judge complex data types other than functions. Therefore, we can use the second method, which is usually used to judge complex data types and basic data types.

Method 2. object.prototype.toString.call method
It returns "[object, type]", and pay attention to the format and case of the return, with lowercase in the front and uppercase in the back.

Basic data types can return corresponding types.

Object.prototype.toString.call(999) // "[object Number]"
Object.prototype.toString.call('') // "[object String]"
Object.prototype.toString.call(Symbol()) // "[object Symbol]"
Object.prototype.toString.call(42n) // "[object BigInt]"
Object.prototype.toString.call(null) // "[object Null]"
Object.prototype.toString.call(undefined) // "[object Undefined]"
Object.prototype.toString.call(true) // "[object Boolean]"

Complex data types can also return corresponding types

Object.prototype.toString.call({a:1}) // "[object Object]"
Object.prototype.toString.call([1,2]) // "[object Array]"
Object.prototype.toString.call(new Date) // "[object Date]"
Object.prototype.toString.call(function(){}) // "[object Function]"

This method can return built-in types

Method 3: obj instanceof Object
You can put the content you want to judge on the left and the type on the right for JS type judgment. It can only be used to judge complex data types, because instanceof is used to detect whether the prototype attribute of the constructor (right) appears on the prototype chain of an instance object (left).

[1,2] instanceof Array  // true
(function(){}) instanceof Function // true
({a:1}) instanceof Object // true
(new Date) instanceof Date // true

The obj instanceof Object method can also judge built-in objects.

Disadvantages: instanceof cannot be used between different window s or iframe s.

Method 4. constructor attribute
In JavaScript, each object has a constructor attribute, which refers to the constructor that initializes the object. It is often used to judge the type of unknown object. For example, given a known value, determine whether it is the original value or object through the typeof operator. If it is an object, you can use the constructor property to determine its type. Therefore, the function to judge the array can also be written as follows:

function isArray(arr){ 
  return typeof arr == "object" && arr.constructor == Array; 
}

Posted by TLawrence on Wed, 10 Nov 2021 05:23:22 -0800