ES6变量的解构赋值(二)对象的解构赋值

前面我们知道,数组的结构赋值需要按顺序进行赋值,

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

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

而对象的解构赋值则是通过对象属性进行赋值,不需要按照顺序进行,而无法匹配的则为undefined

let {a,b,c}={b:1,a:2};
console.log(a);//2
console.log(b);//1
console.log(c);//undefined

实际上,对象的解构赋值的完整写法为:

let {a:a,b:b,c:c}={b:1,a:2};
console.log(a);//2
console.log(b);//1
console.log(c);//undefined

例如上边的例子中,等式左边属性名称与变量名相同,因此可以直接写成let {a,b,c}={b:1,a:2};

同理如果属性名与变量名不同,则不能简写

let {a:b} = {a:1};
console.log(b);//1
//注意:b为变量名,a为属性名,不能够直接输出a

对象的解构赋值也可以设置变量默认值,默认值的生效条件为:对象属性的值严格("===")等于undefined

var {x = 3} = {};//x==>3

var {x = 3} = {x: undefined};//x==>3

var {x = 3} = {x: null};//x==>null

var {x = 3} = {x:0};//x==>0
var {x: y = 3} = {};//y==>3 

数组本身也是特殊的对象,可以进行对象的解构赋值

var arr=[1,2,3];
 let {0:first,[arr.length-1]:last}=arr;
console.log(first);//1
console.log(last);//3

对象解构赋值的应用:

1.可以很方便获取到现有对象的属性或方法

//console对象中log属性拥有打印功能,
//console对象赋值给创建的对象中的log,因此可以直接log()实现打印功能
const { log } = console;
log('hello') // hello   等同于console.log();

猜你喜欢

转载自www.cnblogs.com/kongbaifeiye/p/12019769.html