在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中创建方法非常简单,