预备es6：在react中使用es6必懂的一些知识

1.解构赋值：

把一个对象的多个属性仅通过一条语句赋值给多个变量。

逼格：90

栗子：var {Color,Text,Size} = React; 等价于 var Color = React.Color,Text = React.Text,Size = React.Size;

2.箭头函数

箭头函数替代正常的函数书写

逼格：90

栗子：var test = (a1,a2) => { return a1*a2};等同于 var test = function(a1,a2){ return a1*a2};

3.延展操作符

…props 表示传递一个数组props作为参数，在以前传递数组必须要用apply，在react中使用…props来批量把一个对象的属性赋值到当前虚拟DOM元素。

逼格：95

栗子：var props = {isShow:true}; var component = <Component {…props} />; 等价于 var props = {isShow:true}; var component = <Component isShow={props.isShow} />

4.class extends

class用于定义类与更加直观化的继承

逼格：90

栗子：class Hello extends React.Component {}; 等价于 var Hello = React.createClass({});

5.定义方法

以前在定于方法的时候要使用function关键字，在es6中可以省略掉function关键字 

逼格：80

栗子：render(){ return <Component />}; 等价于 render:function(){ return <Component />};