1. 程式人生 > >ES6 繼續 變量的解構賦值

ES6 繼續 變量的解構賦值

表達式 nbsp 等價 asc 執行 上班 惰性 判斷 com

春節放假這幾天,感覺跟夢一樣,瞬間就過去了。現在上班的前幾天,都感覺有點不真實,不過看到口袋裏的錢,就知道,是真真實實的度過了這個假期。

現在得開始重新工作了;

變量的解構賦值

ES6 允許按照一定模式,從數組和對象中提取值,對變量進行賦值,這被稱為解構(Destructuring)。

以前,為變量賦值,只能直接指定值;

let a = 1;
let b = 2 ;
let c = 3 ;

  現在ES6允許寫成這樣;

let [a,b,c] = [1,2,3];

這段代碼表示可以在數組中提取值,按照對應位置,對變量進行賦值;

其實呢,有點像“模式匹配”,只要等號兩邊的模式相同,左邊的變量就會被賦予對應的值。

技術分享圖片

有點懶,就不打上去了。

如果解構不成功,變量的值就等於undefined

技術分享圖片

let [foo] = [];
let [bar,foo] = [1];

這上面的兩段代碼,都屬於解構不成功,foo的值也就會變成undefined;

另外一種情況是不完全解構,即等號左邊的模式,只匹配到一部分等號右邊的數組。這種情況下,解構依然可以成功;

let [x,y] = [1,2,3];

let [a,[b],c] = [1,[2,3],4]; 

技術分享圖片

技術分享圖片

這兩個例子都屬於不完全解構,但都可以解構成功;

如果等號右邊的不是數組,或者嚴格的說,就是不可遍歷的機構;那麽將會報錯;

let [foo] = NaN;

let [foo] 
= 1; let [foo] = undefined ; let [foo] = false; let [foo] = null; let [foo] = {};

這上面的代碼全部都會報錯;

對於Set結構,也可以使用數組的解構賦值;

let [x,y,z] = new Set([‘a‘,‘b‘,‘c‘]);

技術分享圖片

默認值

解構賦值允許指定默認值;

let [foo = true] = [];

let [a,b=‘c‘] = [‘a‘] ;

let [a,b=‘c‘] = [‘a‘,undefined];

技術分享圖片

註意,ES6 內部使用嚴格相等運算符(===),判斷一個位置是否有值。所以,只有當一個數組成員嚴格等於undefined

,默認值才會生效。

技術分享圖片

上面代碼中,如果一個數組成員是null,默認值就不會生效,因為null不嚴格等於undefined

如果默認值是一個表達式,那麽這個表達式是惰性求值的,即只有在用到的時候,才會求值。

技術分享圖片

上面代碼中,因為x能取到值,所以函數f根本不會執行。上面的代碼其實等價於下面的代碼。

技術分享圖片

默認值可以引用解構賦值的其他變量,但該變量必須已經聲明。

技術分享圖片

上面最後一個表達式之所以會報錯,是因為xy做默認值時,y還沒有聲明。

ES6 繼續 變量的解構賦值