es6 解構賦值

一、在es5中咱們進行相關賦值的時候，只能一個一個進行賦值，使用逗號的進行賦值也只是最右邊的賦值 才生效。在es6中出現了賦值解構，分兩種狀況一個是數組解構，一個是對象解構賦值。這麼好用的方法給我帶來不少便利。

• 數組解構賦值：

 1    // //解構賦值：經過數組對應，對變量進行對應賦值。
 2     let [a,c,v,b]=[1,2,3,4];
 3     console.log(a,c,v,b);
 4     //這種賦值叫作 模式匹配。只要等號兩邊結構同樣就能夠進行賦值。
 5     let [k,[[n],d]]=[1,[[2],3]];
 6     console.log(k,n,d);
 7     //若是解構不成功，對應變量值爲undefined;
 8     let [l,m]=[1];
 9     console.log(m);
10     //不徹底解構，若是等號左邊沒有所有匹配右邊也是能夠結構成功的。
11     let [vv,vb,vc]=[1,2,3,4];
12     console.log(vv,vb,vc);
13     //變量結構須要等號右邊須要itrator結構，也就是說具有能夠被迭代。不然解構不成功。
14     try {
15         // let [cc]=2;//右邊並非數組 TypeError: 2 is not iterable
16         let [dd]={};//不具有iteraor 因此解構也不成功。TypeError: {} is not iterable
17     }catch (e) {
18         console.log(e)
19     }

 1  // 解構容許有默認值。
 2     let [a1,a2=2]=[1];
 3     console.log(a1,a2);
 4     // 須要注意的是在es6內部使用的是嚴格相等來判斷一個位置是否有值。只有當數組中的成員嚴格等於undefined 默認值才能生效。
 5     // 若是默認值裏是null，由於null不嚴格等於undefined 全部默認值也不會生效。
 6     let  [a=2]=[null];
 7     console.log(a);//a=null
 8     // 若是默認值是表達式，這個表達式是惰性求值。只有用到的時候纔會求值。
 9     fn=()=>{
10       return 2;
11     };
12 
13     let [a=fn()]=[1];
14     console.log(a);
15     //只有a對應的右邊的位置的值爲undefined的時候，纔會執行fn，不然不會執行至關於：
16     let x;
17     x=[1][0]===undefined?fn():[1][0];//只有在對應的右邊的元素爲undefined的時候纔會計算表達式。和函數的默認爲表達式也是惰性求值。

 

1     // 默認值也能夠是其餘結構解構的變量，可是對應的變量須要提早聲明，不然會報錯。
2     try {
3         let [ov,oc=ov]=[1];
4         console.log(ov,oc);
5         let [k1=k2,k2]=[undefined,2];
6         console.log(k1,k2);//ReferenceError: Cannot access 'k2' before initialization
7     }catch (e) {
8         console.log(e)
9     }

 

• 對象解構賦值：對象解構，語法解構：let {匹配字符:變量名}={匹配字符:變量值} 例如：let {a:c}={a:2,c=3} ，咱們經常用縮寫形式let {c}={c:2} 縮寫形式，匹配的字符和變量是同樣的。

1    //對象解構：對象解構不須要位置和數組解構位置一致，只要保證解構的變量名和屬性一致便可。
2     let {a,c}={c:4,a:2};
3     console.log(a,c);
4     //若是解構失敗，變量賦值爲undefined.
5     let {acd}={f:2};
6     console.log(acd);

• 對象解構還有一個經常使用的功能，就是取js的一些方法，相似python的反射功能。

1 // 咱們在使用對象解構的時候，能夠獲取對應的對象的方法相似有點想python的反射
2     let {log}=console;
3     log(222);
4     //對象解構 上面的例子都是簡寫形式。其實是以下：//也就是說：a是匹配的關鍵字 而真正的白能量是c.
5     let {a:c}={a:2,c:4};
6     console.log(c)

• 對象解構嵌套解構對象，這種狀況下對應嵌套的解構匹配屬性不能省略。

   //在解構的時候，咱們也能夠用在解構中嵌套解構對象，也就是說能夠在對象解構中嵌套數組解構 這種狀況嵌套對象的屬性不能省略匹配的同名屬性。
    let {ac:ac,ff:[c,a]}={ac:22,ff:[1,2]};
    console.log(ac,c,a);