ES6之解构赋值

//数组
let [a,b,c]=[1,2,3]
console.log(a,b,c)  //1,2,3

let [a,b,...c]=[1,2,3,4,5,6]
console.log(a,b,c)  //1,2,[3,4,5,6]

//对象
let {a,b,c}={a:1,b:2,c:3}
console.log(a,b,c)  //1,2,3

let {a,c,b}={a:1,b:2,c:3}
console.log(a,c,b)  //1,3,2
//对象的解构与数组有一个重要的不同。数组的元素是按次序排列的，变量的取值由它的位置决定；而对象的属性没有次序，变量必须与属性同名，才能取到正确的值。

let {a,b,...c}={a:1,b:2,c:3,d:4}
console.log(a,b,c)  //1,2,{c:3,d:4}

以上是解构成功的情况
如果解构不成功，变量的值就等于undefined
如：

let [a]=[]
console.log(a,b,c)  //undefine

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

如果等号的右边不是数组，那么将会报错。

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

解构嵌套结构对象数组

//1、
let obj = {
  p: [
    'Hello',
    { y: 'World' }
  ]
};

let { p, p: [x, { y }] } = obj;
x // "Hello"
y // "World"
p // ["Hello", {y: "World"}]

//2、
const node = {
  loc: {
    start: {
      line: 1,
      column: 5
    }
  }
};

let { loc, loc: { start }, loc: { start: { line }} } = node;
loc  // Object {start: Object}
start // Object {line: 1, column: 5}
line // 1

最后一次对line属性的解构赋值之中，只有line是变量，loc和start都是模式，不是变量，所以赋值成Object

解构赋值的用途：

1）交换变量的值

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

2）从函数返回多个值

	// 返回一个数组
	function example() {
	  return [1, 2, 3];
	}
	let [a, b, c] = example();
	
	// 返回一个对象
	
	function example() {
	  return {
	    foo: 1,
	    bar: 2
	  };
	}
	let { foo, bar } = example();

3）函数参数的定义

	// 参数是一组有次序的值
	function f([x, y, z]) { ... }
	f([1, 2, 3]);
	
	// 参数是一组无次序的值
	function f({x, y, z}) { ... }
	f({z: 3, y: 2, x: 1});

/4）提取 JSON 数据

	let jsonData = {
	  id: 42,
	  status: "OK",
	  data: [867, 5309]
	};
	
	let { id, status, data: number } = jsonData;
	
	console.log(id, status, number);
	// 42, "OK", [867, 5309]

5）遍历 Map 结构

	const map = new Map();
	map.set('first', 'hello');
	map.set('second', 'world');
	
	for (let [key, value] of map) {
	  console.log(key + " is " + value);
	}
	// first is hello
	// second is world
	

6）输入模块的指定方法

	import { Input } from 'antd'