11.解构赋值一览。

1.对象解构：

• 1-1.可以在一条语句中使用嵌套数据实现一个或多个赋值操作。对象解构就是使用与对象匹配的结构来实现对象属性赋值。
• 1-2.对象的解构是同名属性(模式 name)的变量(name_value)赋值，赋值的是保存属性的变量(name_value)，而不是属性(即匹配的模式 name)。

let { name: name_value, age: age_value } = { name: 'x', age: 18 };
console.log(name_value, age_value); // 'x', 18

• 1-3.对象解构可以在一个类似对象字面量的结构中，声明多个变量，同时执行多个赋值操作。如果想让变量直接使用属性的名称，可以使用简写语法：

let { name, age } = { name: 'x', age: 18 };
console.log(name, age); // 'x', 18

• 1-4.解构不一定与对象的属性匹配。赋值时忽略某些属性，如果源对象的属性不存在，则该变量的值赋值就是 undefined。

let { name, sex } = { name: 'x', age: 18 };
console.log(name, sex); // 'x', undefined

• 1-5.针对源对象不存在属性的赋值，可以在目标对象中使用默认值：源对象属性值严格等于 undefined。

let { name, sex = '0' } = { name: 'x', age: 18 };
console.log(name, sex); // 'x', '0'

• 1-6.解构内部使用函数 ToObject()（运行时环境不能直接访问）把源数据结构转换为对象。意味着结构在对象解构的上下文中，原始值会被当成对象。根据 ToObject()的定义，null 和 undefined 不能被解构，否则会抛出错误。
• 1-7.解构可以使用嵌套结构，以匹配嵌套的属性：

let { job: { title } } = { name: 'x', job: { title: 'web' }};
console.log(title); // 'web'

• 1-8.在外层属性没有定义的情况下不能使用嵌套解构。无论源对象还是目标对象都一样：

let { foo: { title: a } } = { job: { title: 'xx' }}; // Cannot read properties of undefined (reading 'title')
let { job: { title: undefined } } = { job: { title: 'xx' }}; // Identifier 'undefined' has already been declared

• 1-9.对象解构中对象的属性是没有次序的，若多个赋值中有赋值错误的，那么解构将只完成一部分。
• 1-10.对于已经声明的变量用于解构赋值，需要添加圆括号。

let x;
({x} = {x: 1});

2.数组解构：

• 2-1.数组解构就是使用与数组匹配的结构来实现数组元素赋值。
• 2-2.只要等号两边的模式相同，左边的变量就会被赋对应的值。可以使用嵌套解构。

let [x, y] = [1, 3];
console.log(x, y) // 1, 3

let [foo, [[bar], baz]] = [1, [[2], 3]];
console.log(foo, bar, baz) // 1, 2, 3

let [ , , third] = ["foo", "bar", "baz"];
console.log(third) // "baz"

let [x, , y] = [1, 2, 3];
console.log(x, y) // 1, 3

let [head, ...tail] = [1, 2, 3, 4];
console.log(head, tail) // 1, [2, 3, 4]

let [x, y, ...z] = ['a'];
console.log(x, y, z) // "a", undefined, []

• 2-3.解构不成功，即左边没有在对应的右边取到值或左边只匹配一部分右边的数组。

let [a] = [];
let [b, c] = [1]
console.log(a, b, c) // undefined, 1, undefined 

let [x, y] = [1, 2, 3];
console.log(x, y) // 1, 2

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

• 2-4.等号右边不是数组(即不是可遍历的解构)，不具备Iterator接口。Set结构也可以使用数组的结构赋值。只要数据结构具有Iterator 接口就可以使用数组形式的解构赋值。

let [foo] = 1;
let [foo] = false;
let [foo] = NaN;
let [foo] = undefined;
let [foo] = null;
let [foo] = {};

3.数值和布尔值的解构：

let {toString: s} = 123;
s === Number.prototype.toString // true
let {toString: s} = true;
s === Boolean.prototype.toString // true

4.函数参数的解构：

• 4-1.函数 add 的参数表面上是一个数组，但在传入参数的那一刻，数组参数就被解构成变量x和y。对于函数内部的代码来说，它们能感受到的参数就是 x和 y：

function add([x, y]){
  return x + y;
}
add([1, 2]); // 3

5.字符串的解构赋值：转换成一个类似数组的对象。

const [a, b, c, d, e] = 'hello';
console.log(a, b, c, d, e) // "h", "e", "l", "l", "o"

• 5-1.类似数组的对象都有一个length属性，因此还可以对这个属性解构赋值。

let {length : len} = 'hello';
len // 5

6.解构应用：

• 6-1.交换变量的值：

let x = 1;
let y = 2;
[x, y] = [y, x];

• 6-2.从函数返回多个值。函数只能返回一个值，如果要放回多个值，只能将它们放在数组或对象里返回，使用解构赋值取出这些值就非常方便。

function example() {
  return [1, 2, 3]
}
let [a, b, c] = example();

function example1() {
  return {
    foo: 1,
    bar: 2
  }
}
let { a, b } = example1();

• 6-3.函数参数的定义：解构赋值可以方便地将一组参数与变量名对应起来。

// 有序参数
function f([x, y, z]){
  console.log([x, y, z])
}
f([1, 2, 3]);
// 无序参数
function f1({x, y, z}){
  console.log({x, z, y})
}
f1({z: 3, x: 2, y: 1})

• 6-4.提取JSON数据。

let jsonData = {
  id: 42,
  status: "ok",
  data: [15, 26]  
}
let { id, status, data: number } = jsonData;

• 6-5.指定函数参数的默认值。

function foo({x, y = 5}) {
  console.log(x, y);
}
foo({}) // undefined 5

• 6-6.遍历Map结构：任何部署了Iterator接口的对象都可以用for…of循环遍历。Map结构原生支持Iterator接口，配合变量的解构赋值获取键名和键值就非常方便。

const map = new Map();
map.set('first', 'hello');
map.set('second', 'world');

for (let [key, value] of map) {
  console.log(key + " is " + value);
}

• 6-7.输入模块的指定方法：加载模块时，往往需要指定输入的方法。

const { ssss, ffff } = require("source-map")