ES6+ 解构赋值

1. 前言

本节我们会学习到 ES6 中的解构赋值语法，它是 JavaScript 中的一种表达式。在本节中你可以了解以下内容：

• 什么是解构赋值
• 数组的解构赋值
• 对象的解构赋值
• 如何解构嵌套对象和数组

解构赋值就是分解一个数据的结构，并从这数据解构中提取数据的过程，它可以从数组中取出值赋给变量或是将对象中的属性提取出来赋给另一个对象的属性。解构的目的是为了简化提取数据的过程，增强代码的可读性。 把变量放在 [] 或者 {} 中来获取目标对象上的对应的值。

2. 数组的解构赋值

2.1 基本用法

数组的解构赋值是，通过新建一个数组，数组内的变量和目标数组是一一对应的，按照索引的方式去获取值，然后赋值给指定索引上的变量。在 ES6 之前，想获取数组中的值，需要通过 Array[index] 的方式来获取值，这种方式的好处在于可以获取数组上指定索引的值，如果我们想把数组的每一项的值都取出来，赋给变量，这样的写法就显得很笨拙：

var arr = [10, 20];
console.log(arr[0]);  // 10
console.log(arr[0]);  // 20

上面的取值方式是 ES6 之前的写法，有了 ES6 的解构赋值就简单了很多，下面看 ES6 解构赋值是怎么取数组的对应值的：

var [a, b] = [10, 20];
console.log(a);   // 10
console.log(b);   // 20

上面的例子中先声明一个数组，分别在数组的 0 和 1 的索引位置上放置变量 a 和 b，对应着需要获取数组的索引位置，这样就可以从数组当中取到我们想要的值了。