es6新增——解构赋值

解构赋值

ES6允许按照一定模式，从数组和对象中提取值，对变量进行赋值，成为解构（Destructuring）。
赋值运算符右侧是要解构的数组或对象，左侧是对应的模式和声明变量，表现形式为[]、{}

var arr = [1,2,3];
var obj = {name : '李翠花'};
let [a] = arr;
let{name:b} = obj;
console.log(a,b);//1,李翠花

let [a,b,c] = [1,2,3];  ==> let a = 1;
							let b = 2;
							let c = 3;
							
let [ , , c] = [1,2,3];//c:3

解构赋值默认值

解构赋值默认值生效的前提是：解构的内容严格等于undefined（===）；
undefined:声明未赋值，类型undefined

let [a = 1,y = 0] = [];

var [x = f()] = [1] //x =1       这里等于1是因为默认值并没有生效，所以解构出来的仍然是等号右侧结果

function f(){
console.log('测试')
}
var [x = f()] = [] ;
console.log(x);//undefined(函数没有返回值)    这里没有等于1是因为默认值生效，x等于了函数的结果，但函数并没有返回值，所以是undefined

对象解构赋值

对象中键值一样时，可以简写

var obj = {
title:'标题',
brand = 'haha'
};
let {title:a,brand:b} = obj;
console.log(a,b);//标题,haha

简化：

let {title,brand} = obj;  => let {title:title,brand:brand} = obj;
console.log(title,brand);//标题,haha

(这里obj的值就相当于传到了后面的title和brand中，所以输出打印时可以获取到原本对象中的值)，也就是说title和brand既充当模式匹配

字符串解构赋值

const [a,b,c,d,e] = 'hello';//     a//h  b//e  c//l  d//l  e//o

函数形参的解构赋值

标准：

function fn({a,b = 0,c} = {}){
	console.log(a,b,c);
}
fn();//undefined 0 undefined

(因为函数调用时没有传实参，走的是函数的默认值（形参），而此时形参={}，undefined（解构赋值默认值生效），再次走默认值，所以最终输出决定权在{a,b = 0,c}，未赋值的都为undefined，a = undefined ,b = 0,c = undefined)

函数形参的解构赋值优势：
与传统形参列表相比较
1.可以有默认值；
2.可以有缺省参数；
3.可以打乱次序