JavaScript data types

JavaScript has eight built-in types, all of which, with the exception of objects, are collectively called “primitive types.”

  • A null value (null)

  • Undefined (undefined)

  • Boolean (Boolean)

  • Number (number)

  • String (string)

  • Object (object)

  • Symbol (new in ES6)

  • Large integer (BigInt, introduced in ES2020)

Symbol: is a primitive data type introduced in ES6 that represents unique values.

BigInt: Is a new data type introduced in ES2020 to solve the problem of JavaScript numbers up to 53 binary bits (all JavaScript numbers are stored as 64-bit floating point numbers, integers larger than this range, cannot be accurately represented). For details, see: New data type – BigInt

First, the typeof

Typeof is an operator, not a function, followed by a unary expression to the right and returns the data typeof that expression. The returned result is represented as a string of this type (all lowercase letters), including the following eight types: number, Boolean, symbol, String, Object, undefined, function, bigInt, etc.

The principle of Typeof is that different objects are represented as binary at the bottom, and their type information is stored in the first (lower) three bits of binary in Javascript.

  • 000: object

  • 010: a floating point number

  • 100: string

  • 110: Boolean

  • 1: the integer

console.log(typeof undefined) // undefind
console.log(typeof null)      // object
console.log(typeof true)      // boolean
console.log(typeof 43)        // number
console.log(typeof '21')      // string
console.log(typeof {a:1})     // object
console.log(typeof Symbol())  // symbol
console.log(typeof 123n)      // bigint
function a() {}
console.log(typeof a)         // function
var date = new Date(a)var error = new Error(a)console.log(typeof date)      // object
console.log(typeof error)     // objectCopy the code

Second, the instanceof

Instanceof is an instanceof B used to determine whether A is an instanceof b. the expression A instanceof B returns true if A is an instanceof B, false otherwise. It’s important to note here that Instanceof checks for prototypes

In layman’s terms, instanceof is used to compare whether an object is an instanceof a constructor. Note that Instanceof can accurately judge complex data types, but not basic data types

console.log(12 instanceof Number)  // false
console.log('22' instanceof String)  // false
console.log(true instanceof Boolean) // false
console.log(null instanceof Object) // false
console.log(undefined instanceof Object) // false

console.log([] instanceof Array)   // true
console.log({a: 1} instanceof Object) // true
console.log(json instanceof Object) // true
function a() {}
console.log(a instanceof Function)  // true
console.log(new Date(a)instanceof Date)  //true
console.log(reg instanceof RegExp) //true
console.log(error instanceof Error) // trueCopy the code

Three, the Object. The prototype. ToString. Call ()

ToString () is a prototype method for Object that, by default, returns the current Object’s [[Class]]. This is an internal property of the form [object Xxx], where Xxx is the type of the object.

For Object objects, toString() returns [Object Object]. For other objects, you need call/apply to return the correct type information.

console.log(Object.prototype.toString.call(1))          // [object Number]
console.log(Object.prototype.toString.call(1n))         // [object BigInt]
console.log(Object.prototype.toString.call('123'))      // [object String]
console.log(Object.prototype.toString.call(true))       // [object Boolean]
console.log(Object.prototype.toString.call(undefined))  // [object Undefined]
console.log(Object.prototype.toString.call(null))       // [object Null]
console.log(Object.prototype.toString.call({}))         // [object Object]
console.log(Object.prototype.toString.call([]))         // [object Array]
console.log(Object.prototype.toString.call(function a() {}))  // [object Function]
console.log(Object.prototype.toString.call(Symbol()))         // [object Symbol]
console.log(Object.prototype.toString.call(Math))             // [object Math]
console.log(Object.prototype.toString.call(JSON))             // [object JSON]
console.log(Object.prototype.toString.call(new Date()))       // [object Date]
console.log(Object.prototype.toString.call(new RegExp()))     // [object RegExp]
console.log(Object.prototype.toString.call(new Error))        // [object Error]
console.log(Object.prototype.toString.call(window)            // [object Window]
console.log(Object.prototype.toString.call(document)          // [object HTMLDocument]Copy the code

Using this method we can encapsulate an isType method to determine the type

let isType = (type, obj) = > {
    return Object.prototype.toString.call(obj) === `[object ${type}] `
}
console.log(isType('Number'.12))   // true
console.log(isType('Number'.'12')) // falseCopy the code

or

let type = function(o) {
    let s = Object.prototype.toString.call(o);
    return s.match(/\[object (.*?)\]/) [1].toLowerCase();
};
console.log(type(12)) // number
console.log(type('12')) // string
console.log(type({})) // object
console.log(type([])) // arrayCopy the code

Fourth, the constructor

The constructor property lets you know which constructor generated an instance object.

The constructor property represents the association between the stereotype object and the constructor. If the stereotype object is modified, the constructor property is generally modified at the same time to prevent errors when referencing it. Therefore, when modifying a prototype object, you generally modify the point to the constructor property as well.

console.log('22'.constructor === String)             // true
console.log(true.constructor === Boolean)            // true
console.log([].constructor === Array)                // true
console.log(document.constructor === HTMLDocument)   // true
console.log(window.constructor === Window)           // true
console.log(new Number(22).constructor === Number)   // true
console.log(new Function().constructor === Function) // true
console.log((new Date()).constructor === Date)       // true
console.log(new RegExp().constructor === RegExp)     // true
console.log(new Error().constructor === Error)       // trueCopy the code

Note:

Null and undefined are invalid objects and therefore have no constructor. These two types of data need to be judged in other ways.

2. Functions’ constructor is unstable. This is mostly true of custom objects. When developers rewrite Prototype, the original constructor reference is lost and constructor defaults to Object


The article is updated every week, and you can search “front-end highlights” on wechat to read it in the first time

​