React工程师修炼指南
上QQ阅读APP看书,第一时间看更新

1.2 解构赋值

1.2.1 数组的解构

在ES5标准中赋值多个变量需要如下写法:

ES6提供更加简单的解构赋值来实现上述变量的定义:

等号右边的值会按照顺序依次赋值给左边的变量。当然很多情况下,赋值并不是一一对应关系,比如:

上面不完全解构的情况同样是可以使用的,但是也存下如下情况:

同样也会出现右侧参数值不对应的情况:

也可以通过“...”把特定的元素放在变量里:

数组解构可以互换变量,如需要互换a和b的值,在ES5中需要通过一个中间变量来实现,代码如下:

在ES6中可以通过解构赋值来简化上述过程,代码如下:

1.2.2 对象的解构

对象解构写法和数组解构类似,代码如下:

上面结构的名称name、age、height必须和对象里的下标保持一致,不然会报错。同样对象也可以解构多层对象,代码如下:

当然在解构对象的时候也可以自定义变量名称,代码如下:

1.2.3 解构的默认值及参数的解构

不管是数组的解构赋值,还是对象的解构赋值都可以添加默认参数。代码如下:

除了解构数组及对象之外,在函数参数中也是可以使用解构的,同样参数解构也可以给默认参数。代码如下: