今天我們來**乙個新問題：
之前在我們開發的過程中，難免會碰到這樣的情況：
後端傳給我們一串資料，然後我們需要對這個資料進行處理。如果是這樣的乙個資料：
let obj =
let username = obj.username,
userid = obj.userid,
profession = obj.profession,
region = obj.region;
這麼處理起來也不算麻煩，但是如果哪一天物件裡面有100個鍵值對，怎麼辦呢？
這種極端的情況不是沒有，當然我們可以通過一些其他的手段進行規避，這不在今天的討論之列。什麼是解構賦值？
所以當我們有很多個鍵值對的時候，這麼去取值就顯得有點笨拙了。所以es6提出來了乙個新的東西，叫解構賦值，就是用來處理這件事情的。那麼有了解構賦值之後，上面的需求我們可以這麼操作：
let obj =
//同樣還是這個資料
let= obj;
console.
log(username)
;//webpilot
其實這個操作就是從obj裡面取出前面花括號裡面變數所對應的值，並且對應的賦值給花括號裡面的物件。這就是所謂的解構賦值了。
先宣告變數，然後再解構賦值怎麼操作？
當然在這裡有一種情況比較特殊，剛才我們是在宣告變數的同時給這個變數賦值。
那如果我原本就已經宣告好變數了，然後在後面的**中需要讓這個變數等於物件裡面的某一項，用結構賦值的話怎麼做呢？
來看一下，這其實是乙個小技巧：
let obj =
//同樣還是這個資料
let username ='';
//這個變數已經提前宣告好了
= obj;
//在這裡想要讓變數等於物件中的某一項，那這麼操作是會報錯的。這裡涉及到塊級作用域的問題，username外面的大括號是乙個塊級作用域，所以會出問題
//解決方法
(= obj)
;//把他們用括號包起來，當做乙個整體就可以了
還有一種情況，那就是我結構賦值的時候，不想用物件裡面的名字，覺得它太長了，或者其他什麼原因我想給解構出來的變數換乙個名字，怎麼辦呢？
看操作：
let obj =
//還是上面的資料，現在我想取其中的username的值，但是我覺得username太長了，我想給它換乙個變數名稱解構出來。那麼這時候我們可以這麼操作
let= obj;
console.
log(n)
;//webpilot
這看著像是乙個物件中的鍵名和鍵值，不過在解構賦值中它所代表的意思是 ：從obj中取出"username"這個值，並且把這個值賦給新宣告的變數"n".
所以在這裡要注意的是：
新宣告的變數是「n」 而不是別的，在後面用的時候也只能用「n」這個變數取值的時候，如果沒有取到，希望賦給乙個預設值？
在我們取值的過程當中呢，有些物件中可能沒有這個值，那麼這時候我們得到的就是undefined, 這時候程式就會出現一些問題；
那麼在解構賦值中，我們有乙個小方法可以解決這個問題，那就是在取值的時候，先給這個變數乙個預設值。
如果取到了，就用物件裡的值，如果沒有取到，則用預設值。看操作：
let obj =
//還是上面的資料，現在我想取其中的abc的值，但是abc在物件中可能存在可能不存在，這時候我們應該給abc乙個預設值來避免掉一些程式上的問題
let= obj;
//這一步就是在解構賦值的時候，直接給abc賦予了乙個預設值 123
console.
log(abc)
;//123 // 現在obj中是沒有abc這個值的，所以得到的就是預設值
let= obj;
console.
log(username)
;// webpilot
所以如果給它乙個預設值，就能避免掉很多問題。
而如果我們用同樣的設定預設值的方法去取物件中已經存在的值，那麼這時候得到的值就是物件中的值了。
另外預設值的設定和上面別名的設定是可以同時使用的，也就是說我們可以寫這樣的**：
let
= obj;
首先是解構賦值的時候，物件用的是 「{}」 而陣列，同理推一下也應該知道要用 「」 中括號，
所以陣列在解構賦值的時候是這樣寫的 ：
let arr =
['a'
,'b'
,'c'
,'d'
,'e'
,'f'
,'g'];
let[first,second,third]
= arr;
console.
log(first,second,third)
;//a b c
物件的解構賦值是根據鍵名來查詢值的，而陣列的解構賦值是根據下標來查詢值的。
這句話的意思是，上述**中 first得到的值永遠是陣列arr中存的第乙個值，而不管這個值是什麼。
最後陣列解構賦值的時候也可以用別名，也可以用預設值設定。以上就是es6中的解構賦值啦~
前端高階攻略之ES6中的引數預設值
我們都清楚在呼叫函式的過程中，定義的引數缺失，此引數變數的值則會是undefined。怎麼給缺失的引數賦值預設值，在es6之前，並沒有太簡潔的方法，如下段 所示 function myfunction x,y,z myfunction 6 7 這種寫法是不是比較麻煩？預設值的設定是不是不夠直觀？fu...
ES6中的解構
陣列中的解構 輸出 白板么雞 二條物件的解構 輸出 老王 12陣列的結構用 物件的解構用 一定要區分它是陣列還是解構。區分方法 看 它是在賦值還是在拿值，等號左邊，都為解構，等號右邊，都是陣列或者物件。運算子，首先來看 輸出 白板 么雞二條 如果給c加上 運算子 輸出 白板 么雞 二條 三餅 四筒 ...
ES6之 解構賦值
es6允許按照一定模式，從陣列和物件中提取值，對變數進行賦值，這被稱為解構賦值 destructuring 也可以簡稱 解構。下面用 進一步解釋一下什麼叫解構賦值。1.關於給變數賦值，傳統的變數賦值是這樣的 var arr 1,2,3 把陣列的值分別賦給下面的變數 var a arr 0 var b...