数组解构、混合结构以及参数结构

《深入理解ES6》阅读随笔

数组解构

数组解构跟对象解构类似，同样具有数据提取、解构赋值、设置默认值、嵌套解构等特性。但是在提取数组时，有点区别，数组解构是通过数组位置来定位元素。因此在提取时，只需关注位置即可，可以任意重命名。下面是几个在 ES6 中实现对象解构的例子：
提取：

// 定义一家人
let family = ["Tom","Lucy","Jack"]
// 声明
let [child,,father] = family // 想跳过第二个元素直接取第三个，可以在第二个位置上使用一个空的占位符
console.log(child, father) // Tom Jack

赋值：

// 定义一家人
let family = ["Tom","Lucy","Jack"],mother="Lily",father="John"
// 解构赋值
[mother,father] = family
console.log(mother,father) // Lucy Jack

设置默认值：

// 定义一家人
let family = ["Tom","Lucy","Jack"]
// 设置默认值
let [,,,dog="Wangcai"] = family  
console.log(dog) // Wangcai

嵌套解构：

// 定义一家人
let family = ["Tom",["Luck","Jack"],"Wangcai"]
// 嵌套解构
let [child,[mother,father],dog]=family
console.log(child,mother,father,dog) // Tom Luck Jack Wangcai

注意：数组解构跟对象解构一样，同样需要完成初始化操作；
拓展：新的数组解构还有一个变量交换的功能，而在之前 ES5 中时需要借助中间变量来完成该操作的：

let a=3,b=4;
[b,a]=[a,b]
console.log(a,b) // 4 3

混合解构

对象解构与数组解构有很多类似之处，事实上，它们还可以混合在一块一起解构。下面是一个例子：

let family = { child: "Tom", parents: ["Lucy", "Jack"] };
let {
  child,
  parents: [mother],
} = family;
console.log(child, father); // Tom Lucy

参数结构

在函数表达式中，同样可以把对象解构、数组解构以及混合解构的思想拿过来，用于参数解构。下面是一个例子：

const getFatherInfo = ({ child, parents: [mother, father ] }) => {
  return child  + "," + mother+ "," + father;
};
console.log(getFatherInfo({ child: "Tom", parents: ["Lucy", "Jack"] })); // Tom,Lucy,Jack