4.延展參數(shù)處理 Extended Parameter Handling
這部分內(nèi)容主要針對(duì)的是函數(shù)傳值形參的變化,主要是形參默認(rèn)值和Rest參數(shù)
首先是形參帶默認(rèn)值比較好理解,就是在定義函數(shù)的時(shí)候給形參一個(gè)默認(rèn)值
function test(x, y = 7, z = 42) {
return x + y + z;
}
這樣y和z就有一個(gè)初始的默認(rèn)值,這個(gè)比較簡單,也比較常用
接下來要說Rest參數(shù)首先要先說一個(gè)耳熟能詳?shù)膶?duì)象arguments
這個(gè)對(duì)象的使用跟數(shù)組使用基本一致,也是通過下標(biāo)來訪問,也一度讓我認(rèn)為,這個(gè)屌絲的屬性是一個(gè)數(shù)組,但是遺憾的是,這屌絲屬性是一個(gè)對(duì)象
function test(){
console.log(arguments);
console.log(typeof arguments);
}
test(1, 2, 3, 4);
// 打印結(jié)果
[1, 2, 3, 4]
object
調(diào)用傳值和形參個(gè)數(shù)不對(duì)等的時(shí)候,或者回調(diào)函數(shù)不明確回調(diào)的參數(shù)的時(shí)候arguments這個(gè)屬性確實(shí)好用,能幫助使用者快速的熟悉并使用函數(shù),在ES6之后,有了Rest參數(shù)
function test(x, y, ...a){
console.log("x :"+x + ";y :"+y);
console.log(a);
console.log(typeof a);
}
test(1, 2, 3, 4);
// 打印結(jié)果
x :1;y :2
[3, 4]
object
形參x,y都被賦值,剩下的多余的值,統(tǒng)一放到另一個(gè)形參a上,只是,這個(gè)形參前有"...",那"...a"就是Rest參數(shù),這個(gè)參數(shù)也是一個(gè)對(duì)象,用法也是和數(shù)組一樣.
當(dāng)然了,這個(gè)Rest參數(shù)還有其他的用法,比如能拆分字符串,拆分成一個(gè)數(shù)組,每個(gè)元素是字符串對(duì)應(yīng)字符
var str = "test";
// ES6
var arr = [...str];
// ES5
var arr = str.split("");
console.log(arr);
// 結(jié)果
["t", "e", "s", "t"]
也能用在兩個(gè)數(shù)組的拼接
var arr1 = ["吳用", "公孫勝", "關(guān)勝"];
// ES6
var arr2 = ["宋江", "盧俊義", ...arr1];
// ES5
var arr2 = ["宋江", "盧俊義"].concat(arr1);
console.log(arr2);
// 打印結(jié)果
["宋江", "盧俊義", "吳用", "公孫勝", "關(guān)勝"]
相對(duì)能簡單一點(diǎn),這就是Rest參數(shù)的用法
5.模板字符串 Template Literals
(1).字符串填補(bǔ) String Interpolation
這部分主要是對(duì)字符串進(jìn)行插入的變化,以前字符串拼接都用"+", 把每一個(gè)要拼接的字符串都拼接起來,對(duì)很多初學(xué)者來講,很難,而且非常不靈活,在ES6提出了一種新的拼接方法,這種方法使用類似PHP的字符串的拼接
var stu = {
name: "張三",
num:17
}
var score = {
english : 100,
math : 80
}
var message = \`Hello ${stu.name}, 學(xué)號(hào):${stu.num} ,數(shù)學(xué): ${score.math}, 英語:${score.english}\`;
console.log(message);
// 打印結(jié)果
Hello 張三, 學(xué)號(hào):17 ,數(shù)學(xué): 80, 英語:100
這種寫法照比之前用"+"憑借確實(shí)節(jié)省代碼,但是不同于PHP的拼接,JS的這種寫法既不是單引號(hào)也不是雙引號(hào),而是``,就是鍵盤上1那個(gè)按鍵左邊的按鍵,反引號(hào)`,所以使用的時(shí)候需要注意一下,如果不是對(duì)應(yīng)符號(hào),沒有效果.
(2)自定義插值 Custom Interpolation
在函數(shù)傳值上也發(fā)生了變化
function get(){
console.log(arguments);
}
var str1 = "1111";
var str2 = "3333";
// ES5
get([ "http://example.com/foo?str1=", "&str2=", "" ],str1, str2);
// ES6
get\`http://example.com/foo?str1=${str1}&str2=${str2}\`;
函數(shù)調(diào)用有了很大的變化,這兩種寫法arguments打印出來的內(nèi)容相同,第一個(gè)參數(shù)是一個(gè)數(shù)組,后兩個(gè)參數(shù)是str1和str2兩個(gè)字符串的內(nèi)容,因?yàn)閚ode.js完全兼容ES6的寫法,所以見到這種寫法需要認(rèn)識(shí).
(3)Raw String Access 原始字符串的訪問
在模板字符串里,有了一個(gè)新的方法,String.raw(),這是一個(gè)靜態(tài)方法,他用于獲取模板字符串的原始字符串形式.
console.log(String.raw \`foo\n${42}bar\`);
console.log(\`foo\n${42}bar\`);
console.log(String.raw\`Hi\u000A!\`);
console.log(\`Hi\u000A!\`);
第一個(gè)打印會(huì)把模板字符串原樣的打印出來,也就是\n不會(huì)進(jìn)行換行操作,第二個(gè)打印則會(huì)\n進(jìn)行換行操作,下面的例子也差不多.下面的例子是模板字符串作為參數(shù).
function test() {
console.log(arguments);
console.log(arguments[0]); // ["foo", "bar", raw: Array[2]]
}
test \`foo${ 42 }bar\`;
打印arguments之后,arguments分為兩部分,第一部分是一個(gè)數(shù)組,第二部分是42這個(gè)值,打印第一個(gè)參數(shù)數(shù)組,多個(gè)了raw,這個(gè)raw也是一個(gè)數(shù)組.用法如下:
function test(result, ...val) {
console.log(result[0]);
console.log(result.raw[0]); // 結(jié)果相同
console.log(val[0]) // 42
}
test `foo${ 42 }bar`;
6.擴(kuò)展字符串 Extended Literals
這部分主要是進(jìn)制和Unicode這部分的功能性的擴(kuò)展
(1)二進(jìn)制和八進(jìn)制字符串 Binary & Octal Literal
// ES6
// 二進(jìn)制
console.log(0b111110111);
// 八進(jìn)制
console.log(0o767);
// ES5
parseInt("111110111", 2);
parseInt("767", 8);
ES5可以在parseInt的第二個(gè)參數(shù)設(shè)置進(jìn)制,16進(jìn)制也可以.
(2)Unicode字符串和正則表達(dá)式 Unicode String & RegExp Literal
Unicode中的中文有20902字,范圍在4E00-9FA5之間,用法"\u4E00",內(nèi)容就是"一",在ES6里能直接使用16進(jìn)制的數(shù)找到對(duì)應(yīng)的字符
"??".codePointAt(0);
"??" === "\u{20BB7}";
這部分沒有什么太多的東西
