ES6 的解构赋值

数组的解构赋值
var [a, b, c] = [1, 2, 3];
console.log(a); //1
console.log(b); //2
console.log(c); //3

ES6 中允许变量赋值按照一定模式,从数组中提取值对变量进行赋值。且需要一一对应

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

当等号右边数组只有 2 个值时,a 和 b 会被正确赋值,剩下的 c 找不到对应的值,即返回undefined

结构失败,值为 undefined

解构赋值还允许变量拥有初始赋值,即默认值

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

当 c 进行解构赋值时,并没有值可以进行赋值操作所以应为undefined,但 c 拥有默认值3,所以最后打印结果c=3.

当既有默认值,又有匹配值的时候呢?

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

由于解构成功,c 对应的不是 undefined,默认值 3 会被新值覆盖( 3 => 7)

对象解构赋值

不光是数组可以解构赋值,对象也可以。
但是与数组不同是的,在写法上稍微需要谨慎些

在对对象进行解构赋值时,一定要注意属性名与变量名相同!

正确写法:

var obj = {
  a: function () {
    return 1;
  },
  b: '你好'
};
let { a, b } = obj;
console.log(a); //ƒ () {return 1;}
console.log(b); //你好

错误示范

var obj = {
  aa: function () {
    return 1;
  },
  bb: '你好'
};
let { a, b } = obj;
console.log(a); //undefined
console.log(b); //undefined

对象解构赋值也同样可以有默认值

var obj = {
  b: '你好'
};
let { a = 3, b } = obj;
console.log(a); //3
console.log(b); //你好

变量声明语句不能使用圆括号进行解构

//不可以
let [(a)]=[3]
//可以
let a;
[(a)] = [3];
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值