Packaging object

define

Objects are the primary data type in the JavaScript language. Values of the three primitive types — numeric, string, and Boolean — are automatically converted to objects, or “wrappers” of the primitive types, under certain conditions.

The so-called “wrapper object” refers to the three native objects that correspond to numeric, String, and Boolean values respectively. These three native objects can transform values of primitive types into (wrapped into) objects.

var v1 = new Number(123);
var v2 = new String('abc');
var v3 = new Boolean(true);

typeof v1 // "object"
typeof v2 // "object"
typeof v3 // "object"

v1 === 123 // false
v2 === 'abc' // false
v3 === true // false
Copy the code

In the above code, three corresponding wrapper objects are generated based on the value of the original type. As you can see, v1, V2, and v3 are all objects and are not equal to their corresponding simple type values.

Wrapper objects are designed to, first of all, allow the type “object” to override all values in JavaScript, so that the language has a common data model, and, second, to allow values of primitive types to call their own methods.

The three native objects Number, String, and Boolean, when called not as constructors (that is, without new) but as normal functions, are often used to convert values of any type into values, strings, and Booleans.

// Convert a string to a number
Number('123') / / 123

// Convert the value to a string
String(123) / / "123"

// Convert the value to a Boolean value
Boolean(123) // true
Copy the code

The above data type conversion is described in the data Type Conversion section.

In summary, these three objects, when used as constructors (with new), can convert values of primitive types into objects; When used as a normal function (without new), you can convert a value of any type to a value of the original type.

Instance methods

Each of the three wrapper objects provides a number of instance methods, as described later. Here are two methods that they share and inherit from Object objects: valueOf() and toString().

valueOf()

The valueOf() method returns the valueOf the primitive type corresponding to the wrapper object instance.

new Number(123).valueOf()  / / 123
new String('abc').valueOf() // "abc"
new Boolean(true).valueOf() // true
Copy the code

toString()

The toString() method returns the corresponding string.

new Number(123).toString() / / "123"
new String('abc').toString() // "abc"
new Boolean(true).toString() // "true"
Copy the code

Automatic conversion of primitive types to instance objects

In some cases, values of primitive types are automatically called as wrapped objects, that is, the properties and methods of the wrapped object are called. At this point, the JavaScript engine automatically converts the value of the primitive type into an instance of the wrapped object and destroys the instance immediately after use.

For example, a string can call the length attribute, which returns the length of the string.

'abc'.length / / 3
Copy the code

In the above code, ABC is a string, not an object, and cannot call the length property. The JavaScript engine automatically converts this into a wrapper object on which the length attribute is called. When the call ends, the temporary object is destroyed. This is called an automatic conversion of the primitive type to the instance object.

var str = 'abc';
str.length / / 3

/ / is equivalent to
var strObj = new String(str)
// String {
// 0: "a", 1: "b", 2: "c", length: 3, [[PrimitiveValue]]: "abc"
// }
strObj.length / / 3
Copy the code

In the above code, the wrapper object for the string ABC provides several attributes, of which length is just one.

Wrapper objects generated by automatic conversion are read-only and cannot be modified. Therefore, new attributes cannot be added to strings.

var s = 'Hello World';
s.x = 123;
s.x // undefined
Copy the code

The above code adds an x attribute to the string s. The result is invalid and always returns undefined.

On the other hand, the wrapped object instance is automatically destroyed after the call. This means that the next time a property of the string is called, it is actually calling a newly generated object, not the one generated last time, so the property assigned to the last object cannot be retrieved. If you want to add properties to a String, you can only define them on its prototype object, String.prototype (see the section on Object-oriented Programming).

Custom method

In addition to native instance methods, wrapped objects can also have custom methods and properties that can be called directly from the value of the primitive type.

For example, we can add a double method that doubles strings and numbers.

String.prototype.double = function () {
  return this.valueOf() + this.valueOf();
};

'abc'.double()
// abcabc

Number.prototype.double = function () {
  return this.valueOf() + this.valueOf();
};

(123).double() / / 246
Copy the code

The above code customizes a method on the String and Number prototypes so that it can be called on all instance objects. Note that the last line of 123 must be enclosed by parentheses, otherwise the dot operator (.) follows. It would be interpreted as a decimal point.