初探解構賦值

前言

  最近在學習 JavaScript 的新語法( ES6 以後) ，發現有個新語法"解構賦值"，由於用法有點特別所以在此做個紀錄。

內容

  先看到以下範例

let ar = [ 1 , 2 , 3 ,4 ];
//
[ a , b , c ] = ar;
console.log(a);//1
console.log(b);//2
console.log(c);//3
//
[ , , , d] = ar;
console.log(d);//4
//
[ e = 50 , f = 60] = [ 5 ];
console.log( e );//5
console.log( f );//60

解構複製的語法看起來有點奇怪，看起來像是陣列等於陣列，範例在開始時利用這個方法直接賦值到"a"、"b"與"c"，如果是舊的語法可能要打成3次賦值，或是用迴圈來賦值，到這裡看起來還好，接著看到如何賦值"d"，賦值時打了3個","，是為了跳過前三個元素，這樣就可以直接賦值第四個元素到到"d"，這語法我第一次看到時完全無法猜到這個語法在幹嘛，只能說要用"硬記"，最後解構賦值示範如何給預設值，當來源陣列元素比較少的時候就需要考慮，不然會跑出 undefined 的數值。

  整體來說這個語法可以改善要從一個陣列個別賦值時造成程式碼看起來很長的問題，如果陣列的內容數量很多的話也不太適合這個賦值，語法有些不好記，畢竟其它程式語言並沒有這樣的用法，雖然我應該還是不會用這個語法來寫程式碼，但為了跟他人合作這個語法要學起來。

 

參考資料

[ developer.mozilla.org ] 解構賦值