[JS] ES6 中的陣列解構賦值（array destructuring）

在 ES6 中過去的陣列和物件可以透過解構（destructuring）的方式來賦值。這篇文章中，我們會先說明如何透過陣列的方式來賦值。

陣列解構賦值的方法（array destructuring）

過去陣列內的元素在賦值的時候，只能透過直接給值的方式，像是下面這樣：

let numbers = [1, 2, 3];
let a = numbers[0];
let b = numbers[1];
let c = numbers[2];
console.log(a, b, c); // 1, 2, 3

然而在 ES6 中可以直接透過解構的方式賦值，像是下面這樣子：

let [a, b, c] = [1, 2, 3];
console.log(a, b, c); // 1, 2, 3

如此變數 a = 1, b = 2, c = 3，這是最基本的陣列解構賦值方式。

當變數的數量多於賦予的值時，多出來的那個變數會被賦予 undefined 的值（d = undefined）：

// 當變數多於所給的值
let [a, b, c, d] = [1, 2, 3];
console.log(a, b, c, d); // 1, 2, 3, undefined

當輸入的變數少於所給的值的時候，只有被指定到的變數會有值，少掉的變數可以直接空過去，這時候 g = 1, i = 3：

// 當變數少於給的值
let [g, , i] = [1, 2, 3];
console.log(g, i); // 1, 3

我們也可以在陣列解構中賦予預設值，像是下面這樣：

let [a, b, c = 4, d = 'Hello'] = [1, 2, 3];
console.log(a, b, c, d); // 1, 2, 3, "Hello"

如此就可以將變數 c 賦予 4，d 賦予 Hello 的預設值，輸出的結果 c 因為後面有給值，所以依然是 3 ，而 d 在後面沒有給值，就直接帶入了預設值，得到 “Hello"。

如果你使用的是 standardJS 當作你的 code style，那麼你應該很習慣在結尾不加分號，但是在使用陣列的結構賦值時，這麼做++有可能++會噴錯誤。

例如這樣：

let x = 0;
let y = 0;
console.log(x, y)[(x, y)] = [1, 2];
console.log(x, y);

這時候會得到 "TypeError: Cannot set property '0' of undefined 的錯誤。首先簡單說明一下之所以可以不用在結尾加分號是因為在++多數情況++下，

在語句或一段代碼敘述後，加了 Enter 鍵(\n)後，JS 剖析器會在執行期間自動幫你插入分號 @ eddyChang

上面提到是多數情況，但是在++某些情況下++ JS 引擎是不會幫你加上分號的，其中像是這裡的開頭以 [ 開頭的語句。因此在這裡，請記得在 [ 的前面加上分號，寫起來會像是這樣 ;[x, y] = [1, 2]。

更多關於分號的使用請參考 JavaScript 裡的語句用分號結尾是個選項嗎 @ eddyChang