js包装对象简单分析及示例

JS包装对象

JavaScript语言“一切皆对象”，数组和函数本质上都是对象，就连三种原始类型的值——数值、字符串、布尔值——在一定条件下，也会自动转为对象，也就是原始类型的“包装对象”。

• 包装对象”，JS中共有三种：即数值、字符串、布尔值相对应的Number、String、Boolean三个原生对象。这三个原生对象可以把原始类型的值变成（包装成）对象。

  var v1 = new Number(12);
  var v2 = new String('abc);
  var v3 = new Boolean(false);

• 上面代码根据原始类型的值，生成了三个对象，与原始值的类型不同。这用typeof运算符就可以看出来。

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

v1 === 123 // false
v2 === 'abc' // false
v3 === true // false

> 奇怪吗，为什么会这样呢？追溯到JS语言所设计此特点的目的，就是实现JS的’一切皆对象‘的夙愿，并且使得原始类型的值可以方便地调用特定方法。
* 另外Number，Boolean，String如果不加new关键字作为构造函数调用，可用于将任意类型的值转换为数值，布尔值，字符串。

Number(123) // 123
String('abc') // "abc"
Boolean(true) // true

> 可见：当上述三个对象充当构造函数时，可以将原始类型的值转换为对象；当充当普通函数时，可以将任意类型的值，转换为原始类型的值。
### 包装对象实例的方法
* 包装对象即对象，因此继承Object对象提供的原生方法，主要有valueOf方法和toString方法。
- valueOf() :返回包装对象实例对应的原始类型的值----即还原原始类型。

new Number(123).valueOf() // 123
new String("abc").valueOf() // "abc"
new Boolean("true").valueOf() // true

- toString()方法： 返回实例对于的字符串---即字符串化实例。

new Number(1234).toString() // "1234"
new String("abc").toString() // "abc"
new Boolean("true").toString() // "true"

- 原始类型的自动转换
>  原始类型的值可以自动作为对象调用，即调用对象属性和方法。但要注意，JS引擎会自动将原始类型的值转为包装对象，使用后立即销毁。

'abcde'.length
// 5
//字符串本身不是对于，无length属性。JS引擎自动将其包装为对象，在其调用length属性，结束后立即销毁。
var str = 'abc';
str.length // 3

var strObj = new String(str)；
strObj.length=3;

> 'abc'的包装对象有每个位置的值，有length属性，还有一个property---[[PrimitiveValue]]保存字符串原始值。此内部属性外部无法调用，仅供valueOf或者toString这样的内部方法调用。

* 此临时对象是只读的无法改写，这也是字符串无法添加新属性的根本原因。

var s = 'Hello World';
s.x = 123;
s.x // undefined,调用结束后，临时对象随即销毁，即下次调用字符串属性时，实际是调用一个新生对象，而非上次调用所生产的那个，故取不到其上属性。如非要添加属性，可以再起原型对象String.prototype上定义。

- 自定义方法
三种包装对象还可以在原型上添加自定义属性和方法，供原始类型的值直接调用。

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

'abc'.double()
// abcabc

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

(123).double()
// 246

* 对于Boolean对象，常见其类型转换作用如下，这是其即一个单纯的工具。

Boolean(undefined) // false
Boolean(null) // false
Boolean(0) // false
Boolean('') // false
Boolean(NaN) // false

Boolean(1) // true
Boolean('false') // true
Boolean([]) // true
Boolean({}) // true
Boolean(function () {}) // true
Boolean(/foo/) // true