解构赋值

解构赋值是什么？

解构赋值语法是一种javascript表达式。通过解构赋值，可以将属性值从对象或数组中取出，赋值给其他变量。
语法：

//数组解构
var a,b,rest;
[a,b]=[10,20];
console.log(a)
console.log(b)

对象结构
({a,b}={a:10,b:20})
console.log(a)
console.log(b)

...rest 结构对象
({a,b,...rest})={a:10,b:20,c:30,d:40});
console.log(a);
console.log(b);
console.log(c);

 ...rest 解构数组
[a, b, ...rest] = [10, 20, 30, 40, 50];
console.log(a); // 10
console.log(b); // 20
console.log(rest);

解析一个从函数返回
function f(){
return[1,2];
}

var a,b;
[a,b] = f();
console.log(a);
console.log(b);

具体应用场景

1.默认值
var a,b;
[a=5,b=7]=[1];
console.log(a);
console.log(b);

2.交换变量
var a=1;
var b=3;
[a,b]=[b,a]

3.忽略你不感兴趣的返回值
function f(){
return [1,2,3];
}
var [a, , b] = f();
console.log(a); // 1
console.log(b); // 3

4.将剩余数组赋值给一个变量
当解构一个数组时，可以使用剩余模式，将数组剩余部分赋值给一个变量。

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

5.给新的变量名赋值
可以从一个对象中提取变量并赋值给和对象属性名不同的新的变量名。

var o = {p: 42, q: true};
var {p: foo, q: bar} = o;
 
console.log(foo); // 42 
console.log(bar); // true 

6.for of迭代和解构

var people = [
  {
    name: 'Mike Smith',
    family: {
      mother: 'Jane Smith',
      father: 'Harry Smith',
      sister: 'Samantha Smith'
    },
    age: 35
  },
  {
    name: 'Tom Jones',
    family: {
      mother: 'Norah Jones',
      father: 'Richard Jones',
      brother: 'Howard Jones'
    },
    age: 25
  }
];

for (var {name: n, family: {father: f}} of people) {
  console.log('Name: ' + n + ', Father: ' + f);
}