進軍es6(2)---解構賦值

　　本該兩週以前就該總結的，但最近一直在忙校招實習的事，耽誤了好久。目前依然在等待阿里HR面後的結果中...希望好事多磨!在阿里的某輪面試中面試官問到了es6的掌握狀況，說明es6真的是大勢所趨，咱們更須要加快步伐掌握它，跟上前端改革的潮流。

　　上一篇大概提到了es6的一些變量聲明基礎，多是有些乏味的，但今天所講多是在別的語言中都不存在的一種語法現象。它就是今天的主人公"解構賦值"。

　   解構賦值

　　es6代碼能夠在babel官網編寫執行 -> http://babeljs.io/repl/

　　何爲解構賦值，第一次聽到這個名字，我也是至關陌生的。先分析一個小栗子:

　　//es5 

　　var a = 1, b = 2, c = 3;

　　//es6

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

　　這樣看起來就很好理解了，解構賦值就是指從數組和對象中提取值，對變量進行賦值。解構能夠理解爲將對象的結構進行解析，並把值賦給聲明的變量。不光是數組，在別的數據類型中也能夠見到解構賦值的身影。

　　對象:

　　let {a, b} = {a : 'one', b: 'two'};

　　//a = one, b = two

　　字符串:

　　const [a, b, c, d, e] = 'apple';

　　//a='a',b='p'...

　　在函數的參數中:

　　function test({x, y} = {x:0, y: 1}) { return [x, y]; }

　　test(); // [0,1]

　　test({}); // [undefined, undefined]

　　test({a: 2, b: 3}); // [2, 3]

　　

　　對解構賦值的寫法有了大體瞭解後，咱們接着研究下它的用途。

　　1.交換變量值 

　　[x, y] = [y, x]，千萬不要覺得這個是 x= y; y =x。在es6解析後會產生一箇中間變量(babel上顯示的是一個數組)，因此是能夠用做交換變量寫法的。

　　2.函數參數無序定義以及默認值

　　使用自定義函數的時候，偶爾會記不許確函數參數的順序以及個數。一樣能夠利用解構的方法進行參數定義:

　　// 無序定義　　

　　function f({x, y, z, a}) {};

　　f({a: 1, y:2, z:3, x: 4});

　　// 默認定義

　　function f({x, y, z, a=1})();

　　f({}); // x=undefined, y=undefined,z=undefined,a=1

　　3.提取JSON對象,可過濾信息

　　var jsonData = {a:1,b:2,c:[3,4]};

　　let {a,c} = jsonData;

　　4.提取模塊中的方法或函數

　　import React, {Component, PropTypes} from 'react';

 

　　解構賦值在es6中是很簡單的語法，若是還以爲很陌生，那必定要去babel上面多寫寫。