JS data type

In js, data can be divided into the following two types according to the different storage methods (see link at the end of this article) :

  • The original type

    string, number, boolean, undefined, null, symbol

  • Reference types

    Object (Array, Function, RegExp, Date)

Data type judgment

Determine the type of data This section lists four methods and describes the range and limitations of each method. If you are not familiar with the prototype chain, please read the relevant prototype chain knowledge first (see the end of the article).

  1. typeof

    Typeof is generally only used to determine the original type (excluding NULL) and returns a string of that type

    console.log(typeof 'str');  // string
console.log(typeof 1);      // number
console.log(typeof true); // boolean
console.log(typeof undefined); // undefined
console.log(typeof Symbol()); // symbol
Copy the code

    Note: Typeof cannot be used to judge null in primitive types and reference type object. The result will return the string object(except for Function types, which return Function, but object on IE 6, 7, and 8).

    console.log(typeof null);  // object
console.log(typeof {}); // object
console.log(typeof alert); // function
console.log(typeof []); // object
console.log(typeof new RegExp()); // object
console.log(typeof new Date()); // object
Copy the code
  2. contructor

    Constructor refers to the constructor of the instance

    Define a constructor Animal and new instance dog

    const Animal = function (name) {this.name = name};   // Declare a constructor
let dog = new Animal('dog'); // Generate instance dog
Copy the code

    / / attach a constructor property to Animal. / / attach a constructor property to Animal. / / attach a constructor to Animal. Animal. The prototype. The constructor = = = Animal / / true, according to the prototype chain for principle, Console (dog.prototype) // Animal; // Animal; // Animal; console(dog.prototype) // Animal

    console.log('1'.constructor === String);  // true
console.log(new Number(1).constructor === Number); // true
console.log(true.constructor === Boolean); // true
console.log(alert.constructor === Function); // true
console.log([].constructor === Array); // true
console.log(new Date().constructor === Date); // true
Copy the code

    Note:

    1. null.undefinedIs an invalid object and therefore will not existconstructorYes, these two types of data need to be judged in other ways.
    2. Constructor is unstable. This is mainly true of custom objects. When developers rewrite Prototype, the original constructor reference is lost and constructor defaults to Object

    Use constructor to judge that types are too restrictive and inaccurate, error-prone, use them sparingly, or not at all!

  3. instanceof

    Unlike typeof and constructor, instanceof is generally used to determine the typeof reference and returns a Boolean value, such as:

    [] instanceof Array // true

    Instanceof determines the type of the current data by determining whether the prototype of the current instance is the same object as the prototype of the constructor

    const self_instanceof = function (instance, constructor) {
    let instance_proto = instance.__proto__;
    let constructor_proto = constructor.prototype;

    while(true) {
        // Return false when the destination is found
       if (instance_proto === null) {return false};
       // Find returns true
       if (instance_proto === constructor_proto) {return true};
        // When the instance is not the same as the constructor prototype, continue up the prototype chaininstance_proto = instance_proto.__proto__; }}console.log([] instanceof Array)   // true
console.log(self_instanceof([], Array))  // true
Copy the code

    When a page has multiple IFrames, that is, there are multiple global variables window, the judgment of Instanceof will be interfered by data from different IFrames, resulting in unreliability

    Let arrB = []; let arrB = []; ArrB instanceof Array // False if instanceof is used in pageA, arrB instanceof Array // is false because the arrB is constructed from the Array on pageB

    To avoid this problem, use the Array static method array. isArray provided by Es6, or the toString method we’ll mention soon, to determine array. isArray(arrB) // true

  4. toString

    ToString is a method on Object.prototype, Commonly used way as the Object. The prototype. ToString. Call (target), the return value is a Object type string, this method can largely determine all of the data type (except for the custom data types)

    // Define the judgment type function
let getType = target= > Object.prototype.toString.call(target)

console.log(getType(' ')); // [object String]
console.log(getType(2)); // [object Number]
console.log(getType(true)); // [object Boolean]
console.log(getType(undefined)); // [object Undefined]
console.log(getType(null)); // [object Null]
console.log(getType(Symbol())); // [object Symbol]
console.log(getType({})); // [object Object]
console.log(getType([])); // [object Array]
console.log(getType(alert)); // [object Function]
console.log(getType(new RegExp())); // [object RegExp]
console.log(getType(new Date())); // [object Date]
Copy the code

    This method is accurate and stable and recommended

Above is a few views of type judgement, have improper place, still ask big men to correct!

Please refer to relevant knowledge points and articles:

JS prototype chain and inheritance don’t get confused again