Js packing and unpacking

The transformation using the

Each basic type Number, String, Boolean, Symbol have corresponding classes in the object, the so-called boxing conversion, is to convert the basic type into the corresponding object, it is a rather important type conversion.

The global Symbol function cannot be called using new, but we can still use the boxing mechanism to get a Symbol object. We can use the call method of a function to force a boxing.

We define a function that only has return this in it, and then we call the call method of the function to a value of type Symbol, which produces a symbolObject.

We can use console.log to look at the type of this object, which is object, and we can use symbolObject instanceof to see that it’s an instanceof the Symbol class, We find its constructor equal to Symbol, so it is the boxed object of Symbol whichever way we look at it:

    var symbolObject = (function(){ return this; }).call(Symbol("a"));
    console.log(typeof symbolObject); //object
    console.log(symbolObject instanceof Symbol); //true
    console.log(symbolObject.constructor == Symbol); //true
Copy the code

The boxing mechanism frequently produces temporary objects, and in some performance-critical scenarios, we should avoid boxing primitives.

Using the built-in Object function, we can explicitly invoke the boxing capability in JavaScript code.

    var symbolObject = Object(Symbol("a"));
    console.log(typeof symbolObject); //object
    console.log(symbolObject instanceof Symbol); //true
    console.log(symbolObject.constructor == Symbol); //true
Copy the code

The Class attribute to each type of packing objects are private, these properties can use Object. The prototype. The toString access:

    var symbolObject = Object(Symbol("a"));
    console.log(Object.prototype.toString.call(symbolObject)); //[object Symbol]
Copy the code

In JavaScript, there is no way you can change the private Class attribute, therefore Object. The prototype. The toString is a basic type of Object can accurately identify the corresponding methods, it is much more accurate than instanceof.

Note, however, that call itself generates a boxing operation, so you need to work with Typeof to distinguish between primitive types and object types.

Unboxing conversion

In the JavaScript standard, ToPrimitive is defined as a function that converts object types ToPrimitive types (i.e., unboxed conversions).

The conversions of objects to String and Number follow the “unboxing before converting” rule. Unboxing converts an object to a primitive type and then converts it to a String or Number.

The unboxed conversion attempts to call valueOf and toString to get the unboxed base type. If neither valueOf nor toString exists, or if no primitive type is returned, a TypeError is generated.

    var o = {
        valueOf : () = > {console.log("valueOf"); return {}},
        toString : () = > {console.log("toString"); return {}}
    }
    o * 2
    // valueOf
    // toString
    // TypeError
Copy the code

We’ve defined an object o, and o has two methods, valueOf and toString, both of which return an object, and then when we do o*2, you’ll see that valueOf is executed first, then toString, A TypeError is thrown, indicating that the unboxing conversion failed.

The unboxing conversion toString calls toString first. Let’s change this operation from o*2 to String(o), and you’ll see that the order of calls has changed.

    var o = {
        valueOf : () = > {console.log("valueOf"); return {}},
        toString : () = > {console.log("toString"); return{}}}String(o)
    // toString
    // valueOf
    // TypeError
Copy the code

Difference between toString() and valueOf()

A, the toString ()

The toString() method returns a string representing the object

Second, the valueOf ()

ValueOf () returns the original valueOf the specified object. Js uses valueOf() to convert the object to a valueOf the original type (numeric, string, or Boolean).

Example:

var array = ['aa'.'bb'.'cc'];
console.log(array.toString());
console.log(array.valueOf());
/ / the result
> aa,bb,cc
> (3) ["aa"."bb"."cc"]
Copy the code

Call the valueOf ()

Call the toString ()