1. 程式人生 > >ES6系列_3之變量的解構賦值

ES6系列_3之變量的解構賦值

方式 fin undefine efi mage 直接 的區別 pan ima

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

解構有三種類型:

技術分享圖片

1.數組的解構賦值

(1)簡單的數組解構

以前,我們給變量賦值是直接單個指定值,比如:

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

數組解構的方式來進行賦值,如下:

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

總結:從數組中提取值,按照位置的對象關系(次序)對變量賦值。

(2)數組模式和賦值模式統一

可以簡單的理解為等號左邊和等號右邊的形式要統一,如果不統一解構將失敗。相關代碼如下:

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

如果等號兩邊形式不一樣,很可能獲得undefined或者直接報錯。

(3)解構的默認值

解構賦值是允許你使用默認值的,相關代碼如下:

let [foo = true] =[];
console.log(foo); //控制臺打印出true

undefined和null的區別:

*undefined相當於什麽都沒有。

*null相當於有值,但值為null。

2.對象的解構賦值

對象的屬性沒有次序,變量必須與屬性同名,才能取到正確的值。

(1)圓括號的使用

如果在解構之前就定義了變量,這時候再解構會出現問題,而且編譯就會報錯。

let foo;
{foo} ={foo:‘i love you‘};
console.log(foo);

要解決報錯,使程序正常,我們這時候只要在解構的語句外邊加一個圓括號就可以了。

let foo;
({foo} ={foo:‘i love you‘});
console.log(foo); //控制臺輸出i love you

3.字符串解構

字符串解構,此時字符串被轉換成了一個類似數組的對象。

const [a,b,c,d,]="love";
console.log(a);//l
console.log(b);//o
console.log(c);//v
console.log(d);//e

學習參考鏈接為:http://jspang.com/post/es6.html#toc-696 。

ES6系列_3之變量的解構賦值