ES6彙總

查看官方文檔，對ES6進行一次彙總，方便本身回頭複習。

一、 let只在代碼塊中有效，外部沒法讀取和引用，且不存在變量名提高,只能聲明一次

{
    let a=0;
    console.log(a);//0
}
a;//報錯：a is not defined
複製代碼

• 變量 i 是用 var 聲明的，在全局範圍內有效，因此全局中只有一個變量 i, 每次循環時，setTimeout 定時器裏面的 i 指的是全局變量 i ，而循環裏的十個 setTimeout 是在循環結束後才執行，因此此時的 i 都是 10。

• 變量 j 是用 let 聲明的，當前的 i 只在本輪循環中有效，每次循環的 j 其實都是一個新的變量，因此 setTimeout 定時器裏面的 j 實際上是不一樣的變量，即最後輸出12345。

for (var i = 0; i < 10; i++) {
  setTimeout(function(){
    console.log(i);
  })
}
// 輸出十個 10
for (let j = 0; j < 10; j++) {
  setTimeout(function(){
    console.log(j);
  })
}
// 輸出 0123456789
複製代碼

---

2 、 const聲明一個只讀變量，不可改變，且聲明必須初始化數據，不然報錯

const PI = "3.1415926";
PI  // 3.1415926

const MY_AGE;  //報錯    
複製代碼

---

三、解構賦值有兩部分參與

• 結構的源：解構賦值表達式的右邊部分；
• 結構的目標：結構賦值表達式的左邊部分；

數組模型的解構

1、基本型
 let [a, b, c] = [1, 2, 3];
   // 此時 a=1,b=2,c=3
2、嵌套型
  let [a, [[b],c]] = [1, [[2], 3]];
   // 此時 a=1,b=2,c=3
3、忽略型
  let [a, , c] = [1,2,3];
   //此時 a=1,c=3
4、不徹底解構型
   let[a=1,b]=[];
   //此時 a=1,b=undefined
5、剩餘運算符型
   let[a,...b]=[1,2,3];
   //此時 a=1,b=[2,3]
6、字符串型
  let [a,b,c,d,e,f]='potato';
  //此時 a=p,b=o,c=t......
//ps:通常題目中有不借助臨時變量交換兩個變量值的題目
 1、利用ES6解構交換
     var a=1,b=2;
     [a,b]=[b,a];
 2、利用數組進行交換
    var a=1,b=2;
    a=[b,b=a][0];
複製代碼

對象模型的解構

1、基本型
let {foo,bar}={foo:'xxx',bar:'yyy'};
//此時foo='xxx',bar='yyy';
let {baz:foo}={baz:'ddd'};
//此時foo='ddd'
2、可嵌套可忽略
let {p: [x, {y}]} ={p: ['hello', {y: 'world'}] };
console.log(x);//hello
console.log(y);//world
-----忽略----
let {p: [x, {  }] } = {p: ['hello', {y: 'world'}] };
console.log(x);//hello
3、不徹底解構
let {p:[{y}, x]}={p: [{y:'world'}]};
console.log(x);//undefined
console.log(y);//world
4、剩餘運算符型
let {a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40};
console.log(a);//10
console.log(b);//20
console.log(rest);//{c: 30, d: 40}
5、解構默認值型
let {a: x = 10, b: y = 5} = {a: 3};
console.log(x);//3
console.log(y);//5
複製代碼