js-ES6學習筆記-變量的解構賦值


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、解構賦值的規則是,只要等號右邊的值不是對象,就先將其轉為對象。由於undefinednull無法轉為對象,所以對它們進行解構賦值,都會報錯。

11、以下三種解構賦值不得使用圓括號。

  1. 變量聲明語句中,不能帶有圓括號。
  2. 函數參數中,模式不能帶有圓括號。
  3. 賦值語句中,不能將整個模式,或嵌套模式中的一層,放在圓括號之中。

12、可以使用圓括號的情況只有一種:賦值語句的非模式部分,可以使用圓括號。

13、變量解構賦值的用途:

  1. 交換變量的值。[x,y]=[y,x];
  2. 從函數返回多個值。函數只能返回一個值,如果要返回多個值,只能將它們放在數組或對象里返回。有了解構賦值,取出這些值就非常方便。
  3. 函數參數的定義。解構賦值可以方便地將一組參數與變量名對應起來。
  4. 提取JSON數據
  5. 函數參數的默認值
  6. 遍歷Map結構
  7. 輸入模塊的指定方法

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM