1、ES6 允許按照一定模式,從數組和對象中提取值,對變量進行賦值,這被稱為解構(Destructuring)。
2、ES6允許寫成:let [a,b,c] = [1,2,3];上面代碼表示,可以從數組中提取值,按照對應位置,對變量賦值。本質上,這種寫法屬於“模式匹配”,只要等號兩邊的模式相同,左邊的變量就會被賦予對應的值。
3、如果解構不成功,變量的值就等於undefined
。
let [bar, foo] = [1];
foo的值將是undefined。
4、只要某種數據結構具有 Iterator 接口,都可以采用數組形式的解構賦值。
5、解構賦值允許指定默認值。
let [x, y = 'b'] = ['a']; // x='a', y='b' let [x, y = 'b'] = ['a', undefined]; // x='a', y='b'
注意,ES6 內部使用嚴格相等運算符(===
),判斷一個位置是否有值。所以,如果一個數組成員不嚴格等於undefined
,默認值是不會生效的。如果一個數組成員是null
,默認值就不會生效,因為null
不嚴格等於undefined
。
6、解構不僅可以用於數組,還可以用於對象。對象的解構與數組有一個重要的不同。數組的元素是按次序排列的,變量的取值由它的位置決定;而對象的屬性沒有次序,變量必須與屬性同名,才能取到正確的值。
7、如果變量名與屬性名不一致,必須寫成下面這樣。
var { foo: baz } = { foo: 'aaa', bar: 'bbb' }; baz // "aaa" let obj = { first: 'hello', last: 'world' }; let { first: f, last: l } = obj; f // 'hello' l // 'world'
這實際上說明,對象的解構賦值是下面形式的簡寫
let { foo: foo, bar: bar } = { foo: "aaa", bar: "bbb" };
也就是說,對象的解構賦值的內部機制,是先找到同名屬性,然后再賦給對應的變量。真正被賦值的是后者,而不是前者。
8、對象的解構賦值,可以很方便地將現有對象的方法,賦值到某個變量。
let { log, sin, cos } = Math;
上面代碼將Math
對象的對數、正弦、余弦三個方法,賦值到對應的變量上,使用起來就會方便很多。
9、字符串也可以解構賦值。這是因為此時,字符串被轉換成了一個類似數組的對象。類似數組的對象都有一個length
屬性,因此還可以對這個屬性解構賦值。
let {length : len} = 'hello'; len // 5
10、解構賦值的規則是,只要等號右邊的值不是對象,就先將其轉為對象。由於undefined
和null
無法轉為對象,所以對它們進行解構賦值,都會報錯。
11、以下三種解構賦值不得使用圓括號。
- 變量聲明語句中,不能帶有圓括號。
- 函數參數中,模式不能帶有圓括號。
- 賦值語句中,不能將整個模式,或嵌套模式中的一層,放在圓括號之中。
12、可以使用圓括號的情況只有一種:賦值語句的非模式部分,可以使用圓括號。
13、變量解構賦值的用途:
- 交換變量的值。[x,y]=[y,x];
- 從函數返回多個值。函數只能返回一個值,如果要返回多個值,只能將它們放在數組或對象里返回。有了解構賦值,取出這些值就非常方便。
- 函數參數的定義。解構賦值可以方便地將一組參數與變量名對應起來。
- 提取JSON數據
- 函數參數的默認值
- 遍歷Map結構
- 輸入模塊的指定方法