5小時從入門快速掌握ES6新特性（一）
這個是博主新開的一個坑，其目的是為了幫己幫人學(xué)習(xí)ES6。
博主會通過拋出疑問，然后舉一個具有代表性的證明且容易理解例子的方法來學(xué)習(xí)恒水。
希望能夠幫助到你們快速掌握ES6咒劲。
喜歡的話請給個關(guān)注或者點個贊再走吧顷蟆，你們的支持是我創(chuàng)作的動力！
附：
【ES6教程】5小時從入門快速掌握ES6新特性（二）
【ES6教程】5小時從入門快速掌握ES6新特性（三）
一腐魂、什么是ES 6
1帐偎、ES6全稱為EMAScript 6，是由ECMA國際標準組織制定的一項針對JavaScirpt腳本語言的標準化規(guī)范蛔屹，同時也新增了許多特性削樊。是 JavaScript 語言的下一代標準。
參考文檔：https://es6.ruanyifeng.com/
二兔毒、let 和 const 命令
1漫贞、let 命令
let 命令 用于聲明局部變量
{
let a = 10;
var b =20;
}
a //調(diào)用失敗 let 聲明的變量的為局部變量，只在{....}的塊作用域生效育叁。
b //20 var 聲明的變量為全局變量迅脐，在全局作用域生效
2、const 命令
const 命令 用于聲明一個只讀常量豪嗽，一旦聲明了就不能改變谴蔑。const實際上保證的豌骏，并不是變量的值不得改動，而是變量指向的那個內(nèi)存地址所保存的數(shù)據(jù)不得改動隐锭。
const a = 10;
a = 20; //再次賦值失敗 const創(chuàng)建的變量為常量窃躲，一旦聲明了就不能改變
3、變量提升與非變量提升
變量提升指的是變量的作用域提升钦睡。常表現(xiàn)為：
var 聲明變量可以先使用后聲明蒂窒，值為undefined。
consolo.log(value) //undefined
var value = 10;
而非變量提升指的是變量需要 先聲明后使用荞怒，區(qū)別于var 聲明的變量洒琢。常變現(xiàn)為：let聲明的變量。
consolo.log(value) //報錯ReferenceError
let value = 10;
let value2 = 10;
consolo.log(value) //10
三挣输、變量的解構(gòu)賦值
1纬凤、什么是解構(gòu)賦值？
變量的解構(gòu)賦值為ES新推出的特性撩嚼，指的是ES6允許按照一定的模式停士，從數(shù)組或?qū)ο笾腥〕鲋担瑢ψ兞窟M行賦值完丽。 如果解構(gòu)不成功恋技，變量的值就等于undefined。
語法如下：
# 數(shù)組解構(gòu)
let [a,b,c] = [1,2,3] 這種寫法稱為模式匹配逻族，只要 “兩邊” 結(jié)構(gòu)一致即可賦值蜻底。
a //1
b //2
c //3
# 數(shù)組嵌套解構(gòu)
let [a,[[b],c]] = [1,[[2],3]]
a //1
b //2
c //3
# 部分解構(gòu)不成功
let [a，b] = [1]
a //1
b //undefined 部分解構(gòu)不成功
# 對象解構(gòu)
let node = {
sex:'fmale',
age:10
}
let [sex,age] = node;
sex //fmale 對象解構(gòu)聘鳞，對于內(nèi)置對象同樣可以薄辅。
age //10
# 拓展運算符解構(gòu)
let [a,...b] = [1,[2,3,4]]
a //1
b //[2,3,4] 拓展運算符... 解構(gòu)，下一篇文章會解釋
# 字符串的解構(gòu)賦值
let [a,b,c] = '123';
a //1
b //2
c //3
# 函數(shù)參數(shù)的解構(gòu)賦值
function add([x,y]){
return x + y;
}
let value = add([1,2])
value //3 函數(shù)的參數(shù)解構(gòu)賦值 形容 let [x,y] = [1,2]
# 數(shù)值的解構(gòu)賦值
let [a,b,c] = 123
a //1 數(shù)值解構(gòu)
b //2
c //3
//原則上 只要兩邊的結(jié)構(gòu)一致都可以進行解構(gòu)賦值抠璃。
2站楚、解構(gòu)賦值能指定默認值？
解構(gòu)賦值可以指定默認值搏嗡，使用 = 運算符
語法如下：
let [a,b=3] = [1]
a //1
b //3
let [a,b=3] = [1,2]
a //1
b //3
3窿春、解構(gòu)賦值能起別名？
解構(gòu)賦值可以起別名采盒，使用 ：運算符
let [a : one,b = 2] = [1]
one //1
b //2
四旧乞、字符串的拓展
1、字符的Unicode表示法
let value = "\u0061"
value // 'a'
2磅氨、模板字符串
模板字符串指是增強版的字符串尺栖，用反引號（`）標識。
它可以當(dāng)作普通字符串使用烦租，也可以用來定義多行字符串延赌，或者在字符串中嵌入變量货徙，邏輯運算，以及解析javasciprt腳本語言皮胡。
語法如下：
# 普通多行字符串定義
let text = 'Hello '+'<\br>'+ 'world';
text // hello
// world
# 模板字符串 使用反引號標識 標簽將會被解析
let text = `hello <br> world `;
text // hello
// world
（os:所有的空格和縮進都會被保留在輸出之中）
# 模板字符串中 嵌入變量
var [a,b] = {'jack','Bob'}
let text = `hello ${a},I'm $`
text //hello jack, I'm Bob
# 模板字符串中進行邏輯運算
let [a,b] = [1,2]
let result = `${a} + $赏迟 = ${a+b}`
result //1 + 2 = 3
#標簽?zāi)０?# 模板字符串解析JavaSciprt語言屡贺，使用<% %>引入
# 模板字符串默認會將字符串轉(zhuǎn)義
let template = `<ul>
<% for(let i = 1;i<4;i++){ %>
<li>${i}</li>
<% } >%
</ul>`;
templact // <ul>
// <li>1</li>
// <li>2</li>
// <li>3</li>
// </ul>
（os：此處的標簽會被解析，然后被瀏覽器渲染）
3锌杀、模板字符串默認會將字符串轉(zhuǎn)義
詳見官方文檔 https://es6.ruanyifeng.com/
4甩栈、新增字符串的方法
① 對象方法：String.fromCodePoint( )
ES5 提供String.fromCharCode()方法，用于從 Unicode 碼點返回對應(yīng)字符糕再，但是這個方法不能識別碼點大于0xFFFF的字符量没。
ES6 提供了String.fromCodePoint()方法，可以識別大于0xFFFF的字符突想。語法如下：
String.fromCodePonit（'\u{D834}'）; // "?"
② 對象方法：字符串轉(zhuǎn)義String.raw( )
ES6提供一個為字符串轉(zhuǎn)義的方法殴蹄。該方法返回一個斜杠前面再加一個斜杠的字符串。但實際顯示的是被轉(zhuǎn)義后的字符串猾担。
常用于模板字符串袭灯，語法如下：
String.raw`Hello \n world`
//返回結(jié)果為 Hello \\n world
//實際返回的結(jié)果為 Helo \n world
③ 實例方法：includes(), startsWith(), endsWith()
傳統(tǒng)上，JavaScript 只有indexOf方法绑嘹，可以用來確定一個字符串是否包含在另一個字符串中稽荧。ES6 又提供了三種新方法。
includes()：返回布爾值工腋，表示是否找到了參數(shù)字符串姨丈。
startsWith()：返回布爾值，表示參數(shù)字符串是否在原字符串的頭部擅腰。
endsWith()：返回布爾值蟋恬，表示參數(shù)字符串是否在原字符串的尾部。
let text = 'Hello ! ES 6';
text.includes('Hello'); //true
text.startsWith('H'); //true
text.endsWith('6'); //true
④ 實例方法：repeat( )
repeat( args)方法表示惕鼓，將一個字符串重復(fù)幾次筋现，并返回該新字符串。 args代表重復(fù)的次數(shù),如果是小數(shù)則會向上取整箱歧。
‘q’.repate(3); //qqq
'mm'.repeat(3); //mmmmmm
⑤ 實例方法：padStart()矾飞，padEnd()
ES6 2017版本，提供了一個字符串兩個補全方法呀邢。
padStart( num洒沦，parm) 方法：基于首位補全字符，num為補全后的字符串長度价淌，parm為補全的字符申眼。
'c'.padStart(3,'ab'); //abc
padEnd(num,parm)方法：基于末尾補全字符瞒津，num為補全后的字符串長度，parm為補全的字符括尸。
'c'.padEnd(3,'ab'); //cab
⑥ 實例方法：trimStart( )巷蚪、trimEnd( )
ES6 2019版本提供了兩個去除空格的方法，trimStart( )濒翻、trimEnd( )屁柏，其行為是trim( )是一致的。
const text = ' abc ';
a.trim(); //'abc'
a.trimStart(); //'abc '
a.trimEnd(); //' abc'
⑦ 實例方法：matchAll( )
matchAll( ) 一個字符串中正則匹配的所有字符子串有送。
詳見正則表達的拓展淌喻。
⑧ 實例方法：replaceAll( )
replaceAll (‘被替換的字符’,'要替換的字符' ) 是ES 6新推出的實例方法，用于替換所有的指定字符雀摘。
對比以往的replace( )方法裸删，以往的方法只能替換第一個的匹配的結(jié)果。而replaceAlll( )則替換所有阵赠。
const text = 'abca';
text.replace('a','1'); //1bca
text.replaceAll('a','1'); //1bc1
結(jié)尾
好了今天的內(nèi)容就到這里了涯塔，如果能夠幫到你的話，希望你能留下個關(guān)注或者點個贊吧清蚀。
