在看基礎包裝類型之前，回顧一下什么是引用類型：
引用類型是一種數據結構，用於將數據和功能組織在一起。
它包括：
- Object類型
- Array類型
- Date類型
- RegExp
- Function類型
什么是基本包裝類型？
基本包裝類型是ECMAScript為了便於操作基本類型值提供的三種特殊的引用類型:
- Boolean
- Number
- String
引用類型和基本包裝類型的區別在於對象的生存期：
引用類型
使用new操作符創建的應用類型實例，在執行流離開當前作用域之前都一直保存在內存當中。
基本包裝類型
自動創建的基本包裝類型對象，只存在於一行代碼執行的瞬間，然后立即被銷毀。
Number類型
Number是與數字值對應的引用類型。
在Number類型中,valueOf()方法返回對象表示的基本類型的數值；
toLocaleString()和toString()方法返回字符串形式的數值。
Number類型方法：
① toString()
傳遞一個表示基數的參數，告訴它返回幾進制數值的字符串形式。
var num = 10;
console.log('不傳參數：' + num.toString()); //不傳參數：10
console.log('二進制：' + num.toString(2)); //二進制：1010
console.log('八進制：' + num.toString(8)); //八進制：12
console.log('十進制：' + num.toString(10)); //十進制：10
console.log('十六進制：' + num.toString(16)); //十六進制：a
② toFixed()
作用： 該方法會按照指定的小數位返回數值的字符串表示，並有自動舍入的特性。
該方法很適合處理貨幣值
var num = 10;
console.log('顯示兩位小數: ' + num.toFixed(2));
var num1 = 11.12354;
console.log('顯示三位小數: ' + num1.toFixed(3));
/* 輸出
顯示兩位小數: 10.00
顯示三位小數: 11.124
*/
③ toExponential()
作用： 格式化數值，該方法會返回指數表示法（也稱e表示法）
該方法接收一個參數，表示顯示幾位小數
let num = 1000;
console.log('指數表示：' + num.toExponential(2));
/* 輸出
let num = 1000;
console.log('指數表示：' + num.toExponential(2));
*/
③ toPrecision()
toPrecision()接收一個參數，表示數值的所有數字的位數，然后則根據要顯示的位數，看哪種格式適合表達則返回哪種格式。
let num1 = 1200;
console.log('一位數顯示：' + num1.toPrecision(1));
console.log('兩位數顯示：' + num1.toPrecision(2));
console.log('四位數顯示：' + num1.toPrecision(4));
console.log('六位數顯示：' + num1.toPrecision(6));
/* 輸出
一位數顯示：1e+3
兩位數顯示：1.2e+3
四位數顯示：1200
六位數顯示：1200.00
*/
String類型
string類型是字符串的對象包裝類型。
String對象的方法也可以在所有基本的字符串值中訪問到。
其中，valueOf()、toLocaleString()、toString()方法，都返回對象所表示的基本字符串值。
String類型的每個實力都有一個length屬性，表示字符串包含多個字符。
let strValue = 'Give me a book';
console.log('strValue的length：' + strValue.length);
/* 輸出
strValue的length：14
*/
String類型提供多種方法：
字符方法
① charAt()
作用：用於訪問字符串中特定的字符。
該方法接收一個參數，即要訪問的字符的索引。然后返回該索引位置的字符。
var stringValue = 'QuanzhiGaoshou_yexiu';
console.log(stringValue.charAt(5));
/* 輸出
h
*/
② charCodeAt()
作用：用於訪問字符串中特定的字符。
該方法接收一個參數，即要訪問的字符的索引。然后返回該索引位置的字符的字符編碼。
var stringValue = 'QuanzhiGaoshou_yexiu';
console.log(stringValue.charAt(5)); //輸出 h
console.log(stringValue.charCodeAt(5)); //輸出 104
另外，訪問字符還可以用方括號方法：
var stringValue = 'QuanzhiGaoshou_yexiu';
console.log(stringValue[5]); //輸出 h
③ concat()
作用：拼接字符串，返回一組新字符串
var stringValue = 'QuanzhiGaoshou ';
console.log('New string: ' + stringValue.concat("Yexiu"));
console.log('some String: ' + stringValue.concat("Yexiu","!","~"));
console.log('stringValue: ' + stringValue);
/* 輸出
New string: QuanzhiGaoshou Yexiu
some String: QuanzhiGaoshou Yexiu!~
stringValue: QuanzhiGaoshou
*/
注：拼接字符串最常用的還是“+”連字法
④ slice() ⑤ substr() ⑥ substring()
三個方法都是基於字符串創建新字符串，且都會返回被操作字符串的一個子字符串。
三個方法都接收2個參數，第二個可選:
- 第一個參數： 開始的位置（索引）
- 第二個參數：
slice()和substring()兩個方法的第二參數都是結束的位置，substr()是需要返回字符的個數。
//例1
var stringValue = 'QuanzhiGaoshou yexiu';
console.log('slice1：' + stringValue.slice(5));
console.log('substr1：' + stringValue.substr(5));
console.log('substring1: ' + stringValue.substring(5));
/*
slice：hiGaoshou yexiu
substr：hiGaoshou yexiu
substring: hiGaoshou yexiu
*/
從例1可以看出，三個方法在只接收一個參數的情況下，輸出結果都是相同的，它們在沒接收到第二個參數的時候，都默認結束位置為字符末尾。
//例2
var stringValue = 'QuanzhiGaoshou yexiu';
console.log('slice2：' + stringValue.slice(5,6));
console.log('substr2：' + stringValue.substr(5,6));
console.log('substring2: ' + stringValue.substring(5,6));
/* 輸出
slice2：h
substr2：hiGaos
substring2: h
*/
可以看出，slice 和 substring 的第二參數都是指定結束的位置。
而substr的第二參數是指定輸出字符的個數。
//例3
var stringValue = 'QuanzhiGaoshou yexiu';
console.log('slice3：' + stringValue.slice(5,3));
console.log('substr3：' + stringValue.substr(5,3));
console.log('substring3: ' + stringValue.substring(5,3));
/* 輸出
slice3：
substr3：hiG
substring3: nz
*/
從上例（例3）可以看出, 如果第二個參數小於起始位置（也就是第一參數），substr()返回的是字符的個數，所以沒受到影響。
區別在於slice()和substring()方法，兩個的第二參數都是結束位置，但是slice()方法在結束位置小於起始位置的時候，會返回空。substring()則會返回這兩個索引之間的字符。
這三個方法還有個主要的區別是在參數傳入負數的情況下：
//例4
var stringValue = 'QuanzhiGaoshou yexiu';
console.log('slice4：' + stringValue.slice(-4));
console.log('substr4：' + stringValue.substr(-4));
console.log('substring4: ' + stringValue.substring(-4));
console.log('slice5：' + stringValue.slice(5,-4));
console.log('substr5：' + stringValue.substr(5,-4));
console.log('substring5: ' + stringValue.substring(5,-4));
/* 輸出
slice4：exiu
substr4：exiu
substring4: QuanzhiGaoshou yexiu
slice5：hiGaoshou y
substr5：
substring5: Quanz
*/
slice()方法在處理負數時的具體表現就是，將從被操作字符的開始往前數。按照書中的說法就是：
slice()方法將會將傳入的負值與字符串的長度相加。
substr()如果是第一個參數接收負數，處理方法和slice()一樣。而如果第二個參數傳入負數，則會轉為0；
substring()方法則是將所有負數轉為0；
⑦ indexOf() ⑧lastIndexOf()
兩個方法是字符串的位置方法，從一個字符串中搜索給定的子字符串然后返回字符串的位置（如果沒找到該字符串，則返回-1）。
兩個方法的區別是indexOf()從字符串開頭向后搜索，lastIndexOf()則是末尾向前搜索。
var stringValue = 'Come on~ today!';
console.log('沒找到: ' + stringValue.indexOf('yes'));
console.log('indexOf: ' + stringValue.indexOf('o'));
console.log('lastIndexOf: ' + stringValue.lastIndexOf('o'));
/* 輸出
沒找到: -1
indexOf: 1
lastIndexOf: 10
*/
兩個方法都接受第二參數，第二參數主要是指定從什么位置開始搜索，indexOf()會忽略指定位置之前的字符往后搜索;lastIndexOf()則剛好相反，會忽略指定位置之后的字符往前搜索。
var stringValue = 'Come on~ today!';
console.log('indexOf: ' + stringValue.indexOf('o',3));
console.log('lastIndexOf: ' + stringValue.lastIndexOf('o',3));
/* 輸出
indexOf: 5
lastIndexOf: 1
*/
應用第二參數，可遍歷一個長字符串，找出查找字符的所有位置：
var stringValue = `hello, I've been watching TV recently. I also have a cute cat.`;
var positions = [];
var pos = stringValue.indexOf('a');
while(pos > -1){
positions.push(pos);
pos = stringValue.indexOf('a', pos + 1);
}
console.log('字符串內所有字符a的下標是： ' + positions);
/* 輸出
字符串內所有字符a的下標是： 18,41,47,51,59
*/
⑨ trim()
該方法會創建一個字符串副本，刪除該字符串前后的空格（中間的空格不受影響）。
var stringValue = ' Hei~ happy! ';
console.log(stringValue);
console.log(stringValue.trim());
/* 輸出
Hei~ happy!
Hei~ happy!
*/
注：另有 trimLeft() 和 trimRight() 方法分別刪除左右空格
⑩ toLowerCase() ⑪ toLocaleLowerCase() ⑫ toUpperCase() ⑬ toLocaleUpperCase()
這四種方法的主要作用是轉換大小寫:
var stringValue = ' Hei~ happy! ';
console.log('toLowerCase: ' + stringValue.toLowerCase());
console.log('toLocaleLowerCase: ' + stringValue.toLocaleLowerCase());
console.log('toUpperCase: ' + stringValue.toUpperCase());
console.log('toLocaleUpperCase: ' + stringValue.toLocaleUpperCase());
/* 輸出
toLowerCase: hei~ happy!
toLocaleLowerCase: hei~ happy!
toUpperCase: HEI~ HAPPY!
toLocaleUpperCase: HEI~ HAPPY!
*/
這其中，toLowerCase()和toLocaleLowerCase() 以及 toUpperCase()和toLocaleUpperCase()的區別主要是時區。
⑭ match()
字符串的模式匹配方法，只接收一個參數，返回一個數組。
var text = 'cat, bat, sat, fat, ymt';
var pattern = /.at/;
var matches = text.match(pattern);
console.log(matches);
/* 返回一個數組
[ 'cat',
index: 0,
input: 'cat, bat, sat, fat, ymt',
groups: undefined ]
*/
返回的第一項是匹配的項，第二項是位置索引。
之所以上例只匹配了一項，是因為匹配規則中不是全局模式。
var text = 'cat, bat, sat, fat, ymt';
var pattern = /.at/;
var pattern1 = /.at/g;
var matches = text.match(pattern);
var matches1 = text.match(pattern1);
console.log('matches: ' + matches);
console.log('matches1: ' + matches1);
/* 輸出
matches: cat
matches1: cat,bat,sat,fat
*/
⑮ search()
該方法接收一個參數，返回字符串中第一個匹配項的索引；
如果沒有找到匹配項，則返回-1。
var text = 'ymt, cat, bat, sat, fat';
var pos = text.search(/at/);
console.log('at 第一次出現的位置： ' + pos);
/* 輸出
at 第一次出現的位置： 6
*/
⑯ replace()
該方法接收兩個參數，第一個參數可以是RegExg對象或者一個字符串，第二個參數是一個字符串或者一個參數。
var text = 'ymt, cat, bat, sat, fat';
var result = text.replace(/at/g, 'ond'); //全局更改
var result1 = text.replace(/at/, 'ond'); //只更改第一個匹配項1
var result2 = text.replace('at', 'ond'); //只更改第一個匹配項1
console.log('result: ' + result);
console.log('result1: ' + result1);
console.log('result2: ' + result2);
/* 輸出
result: ymt, cond, bond, sond, fond
result1: ymt, cond, bat, sat, fat
result2: ymt, cond, bat, sat, fat
*/
如上例，如果第一個參數是字符串或者是RegExg對象但沒全局模式，那么只會更改第一個匹配項；
如果需要所有匹配項都更改，則需要接受RegExg對象並設置全局。
replace()第二參數可以實現更精細的提替換操作：
比如用戶輸入的值，會輸入一些轉義字符，但這些轉義字符在html中有作用，不一定會顯示出來，這就可以用到。
var text = '2*3 > 2+3';
function htmlEscape(text){
return text.replace(/[<>]/g,function(match,pos,originalText){
switch(match){
case '<':
return '<';
case '>':
return '>';
}
})
}
console.log(htmlEscape(text));
/* 輸出
2*3 > 2+3
*/
⑰ split()
split()方法容易和slice()方法混淆，但它們實際上作用不同：
slice()是返回被操作字符串的一段指定的子字符串。split()是分割字符串，指定一個分割符將一個字符串分割成多個子字符串，並將結果放入一個數組中。splice()用於數組的操作方法
split()方法第二參數可選，用於指定數組長度。
var text = 'ymt, cat, bat, sat, fat';
console.log(text.split(','));
console.log(text.split(',',3));
/* 輸出
[ 'ymt', ' cat', ' bat', ' sat', ' fat' ]
[ 'ymt', ' cat', ' bat' ]
*/