解构赋值ES6

es6解构赋值

定义：

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

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

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

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

// …rest 解构对象（最新）
({a, b, …rest} = {a: 10, b: 20, c: 30, d: 40});
console.log(a); // 10
console.log(b); // 20
console.log(rest); // {c: 30, d: 40}

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

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

更多应用场景

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]
	console.log(a);
	console.log(b);
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）；
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);
}

// “Name: Mike Smith, Father: Harry Smith”
// “Name: Tom Jones, Father: Richard Jones”