在redux中,尤其在reducer对action处理上我们会使用下面常见的es6语法:
一. ...
1.省略赋值(在结构赋值中使用...)
一个数组形式的结构赋值:
- var [a,b,c]=[1,2,3]
- console.log(a)
- console.log(b)
- console.log(c)
打印输出1 2 3!
我们如果使用了...
- var [a,...c]=[1,3,4,5,6]
- console.log(a)
- console.log(b)
- console.log(c)
结果:
可见在结构复制中,...会把后面的以集合的形式复制给...后面的变量
2.展开运算符(在数组中使用...)
在数组中使用:
- var arr=[1,3];
- var arr2=[...arr,5]
- console.log(arr2)
结果:
会把arr展开后自动赋值到arr2中
二. object.assign()
- var obj={a:"a",b:"b"}
- var obj2={c:"c"}
- var obj3=Object.assign(obj,obj2)
- console.log(obj3)
会把obj和obj2合并,
如果当合并的对象出现了相同的key,遵循后替前的原则:
- var obj={a:"a",b:"b"}
- var obj2={b:"c"}
- var obj3=Object.assign(obj,obj2)
- console.log(obj3)
在react的jsx使用中,我们有很多的循环处理,我们知道render方法可以显示组件里面的jsx:
- var arr=[
- <li>1</li>,<li>2</li>,<li>3</li>
- ];
三. map方法
- var arr=[1,3];
- var arr2=arr.map(function(item,i){
- return item+1;
- })
- console.log(arr2)
结果:
map方法接收一个回调函数,第一个参数就是数组某一项的值,我们return出我们的处理,最后返回一个新数组。
在react的组件中,我们会有很多的数据循环处理,
四. class
我们react创建组件采用推荐的子类继承父类的形式,里面会使用构造函数,里面会使用super函数,在里面我们可以:
this.state.xx定义各种状态,用来在jsx中使用
同理,在class中创建方法非常简单,