前情提要：

繼續講著工具力的源頭

我：所以你們這些工具人，跟她的姐妹差別就是有沒有能力？

//primitive
let x = 12;
let y = "hi";
let z = true;

//用typeof 判斷型別
typeof x; //Number
typeof y; //String
typeof z; //Boolean

（方函式看了阿物件，兩人點了點頭後）
方函式：其實那也不完全正確，但我覺得用講的不容易理解，你直接看吧。（拿出手機）

看似正常的故事？

（畫面中充滿了人，似乎是一個聚會）

JS：雖說是我的生日，但總覺得有點無聊啊。
字串姐：那讓我來增加一點生日感覺吧（手又發光！空氣中接著出現了紅色慶祝文字）

let hbdString = "生日快樂JS"; 
hbdString.fontColor("red");

我：等等，發光跟接踵而來不尋常的現象，難道？！

她們也有血繼限界能力？！

....不對

那是誰？

瞬間能力的原理 -- 包裹物件

發光的瞬間，出現在畫面前的是：長像物件的女子覆蓋住字串姐，接著就迅速消失了，以下用程式碼來試著解釋

let tempObj = new String("生日快樂JS");
hbdString = tempObj.fontColor("red"); //得到紅色效果
tempObj = null;

這瞬間會透過對應的物件建構器，將hbdString包裝成一個物件，然後透過原型鍊找fontColor()這個方法。

方函式：沒錯，那為何說是一瞬間的能力呢？
還記得它如果變成物件的話，應該可以自訂屬性或方法這件事吧？

let hdbString = "生日快樂JS";
let hbdString2 = new String("換方式生日快樂");

//分別賦予屬性
hbdString.text = "生日快樂";
hbdString2.text = "生日快樂2~";

//讀取屬性
console.log(hbdString.text);
console.log(hbdString2.text);

hbdString結果卻是顯示undefined！

hbdString無法取到自訂的屬性text，因為它本身其實還是基本型別(primitive)。

好，那我們再整理一下包裹器的整個流程：

let x = "hi";
x.length; 

短短的一行內容，其實做了以下的事情：

1. 創造一個新物件，透過new串連對應的物件原型，
2. 透過原型鍊，從原型內找尋要使用的方法
3. 回傳使用方法後的值
4. 立刻刪除剛剛建立的物件
5. 變回基本型別內容

這個對應的物件也就是所謂的「基本型別包裹器」(Primitive Wrapper)。

除了String之外，還有許多的包裹器，以下簡單條列常見的：

Number();
Boolean();
String();

//以及之前介紹過的Date
Date();
Map();

什麼是包裹器？

在轉換的那一刻，我自己會視為對應型別物件的實例(instance)，可以透過instanceof這個方法解釋：

let x = "hi 87";
x = new String("hi 87");

x instanceof String; // true

上面提過，那個時刻會new一個新的物件，由上結果可試著推論，建構出來的x是String的實例。
但實際執行上，它只會是一瞬間的實例，隨後就轉回基本型別內容。

如何取得包裹器內的值

如果想要取得內部的值，可透過valueOf()來達成。

let x = new String("hi 87");
x.valueOf(); // "hi 87"

基本型別還是建構式？都幾？

講了這麼多，所以應該選擇哪個使用呢？以下提供兩個點：

1. 假設我們今天要判斷輸入值的型別
當你用建構式用一個String:

let x = new String("i am string");
function isString(input){
    if(typeof x  === "string")return "是字串呢";
}
isString(x);
console.log(isString(x));

當你用基本型別用String:

let x = "hi";
function isString(input){
    if(typeof x  === "string")return "是字串呢";
}
isString(x)
console.log(isString(x));

當使用建構式建立的內容，都是物件，還需要再多一個步驟的處理。

另一個原因是：

2. 基本型別在處理與運算時的效率也遠高於物件型別。

-- to be continued --

那今天就到這邊摟！
每天的休息，是為了後面的追求，明天見。

reference:

重新認識 JavaScript: Day 23 基本型別包裹器 Primitive Wrapper
JavaScript Primitive Wrapper Types