JS中包裝對象、原始資料類型之間的深度剖析

1. 字符串定義

在平時開發中定義字符串無疑3種方式：

let str1 = 'test'
let str2 = String('test')
let str3 = new String('test')

2.定義分析

眾所周知使用 new 關鍵字定義的都是對象。所以可以清楚的知道str3是一個對象，對于str1只是定義了一個變量，然后做了賦值操作，str2就是使用類似于Number、Boolean等方法的類型轉換。最終返回的str2也只是是一個字符串。

let str1 = 'test'
let str2 = String('test')
let str3 = new String('test')console.log(typeof str1);//string
console.log(typeof str2);//string
console.log(typeof str3);//object

3.問題深入

我們知道在js中的變量在內存中的存儲有兩種形式，值類型存儲和引用類型存儲。像上面的str1、str2就是值類型儲存，str3就是引用類型儲存。所以String在JS中是基本類型，基本類型是存儲在棧(stack)內存中的,數據大小確定，內存空間大小可以分配。而引用類型是存儲在堆(heap)內存中的, 棧中存在的僅僅是一個堆的指針，就像這兒str3存的是new String()實例的一個地址，而正真的實例對象在堆中。所以我們可以為str3添加一些屬性和方法。

str1.name='hello'
str2.name='hello'
str3.name='hello'console.log(str1.name);//undefined
console.log(str2.name);//undefined
console.log(str3.name);//hello

4.為什么普通字符串也有String上的方法

let str1 = 'test'
let str2 = String('test')
let str3 = new String('test')str1.length//4
str2.length//4
str3.length//4String.prototype.newFun = function () {  console.log('test Fun');
}
str1.newFun()//test Fun
str2.newFun()//test Fun
str3.newFun()//test Fun

js中判斷字符串包含另一個字符串，可以發現不管是String上原本方法，還是給String原型上綁定的方法，字符串和對象字符串都可以調用。數字、字符串、布爾三者，在JS中稱為原始的(primitives)資料類型，再加上null與undefined也是。除了這些類型外，其他的都是對象。(注: ES6的Symbol是新加的原始資料類型)，對象中有一類是包裝對象（String，Number，Boolen ）分別對應數字、字符串和布爾類型。

5.包裝對象、原始資料類型

包裝類型與原始資料類型之間的正確轉換方式如下:
原始->包裝: new Number(123)
包裝->原始: (new Number(123)).valueOf()
包裝對象是個對象，所以它與原始資料類型并不相同，用typeof與instanceof都可以檢測出來:

let str1 = 'test'
let str2 = String('test')
let str3 = new String('test')str1 instanceof Object//false
str2 instanceof Object//false
str3 instanceof Object//true//作為對象來進行比較，因為對象是參照的，不同的對象不可能相等:
let str4 = new String('test')
console.log(str1 === str2);//true
console.log(str3 === str4);//false

歸根結底就是就是js就是這么設計的，原始資料類型的方法與屬性是"借"來的，一個原始的資料類型值，并沒有屬性或方法，它的屬性和方法是向包裝對象"借來"的，所以原始資料類型是可以向 new String() 或者 new Number() 借來所有的方法。但是自己本身卻沒有屬性和方法。所以這也就是為什么str1、str2可以使用一些對象的方法和屬性。