ES6—变量的解构赋值

数组的解构赋值

一、基本用法
1、完全解构:等号两边的模式相同,左边的变量就会被赋予对应的值。
2、不完全解构:等号左边的模式,只匹配一部分的等号右边的数组,解构依然可以成功
3、解构不成功:等号左边变量的值为undefined
二、默认值
1、数组成员严格等于undefined,默认值生效。
2、数组成员为null,默认值不生效。
3、默认值是表达式,此表达式是惰性求值,只有在用的时候才会求值。
4、默认值可以引用解构赋值的其他变量,前提是此变量必须已经声明。

对象的解构赋值

一、基本用法
1、对象的解构赋值,先找到同名属性,再赋值给对应的变量。示例代码如下:

let { foo: foo, bar: bar } = { foo: "aaa", bar: "bbb" };//可简写为 let { foo, bar } = { foo: "aaa", bar: "bbb" };
let { foo: foo1, bar: bar1 } = { foo: "aaa", bar: "bbb" };//foo,bar属性值分别赋值给变量foo1和bar1

2、如果解构简写,变量就必须与属性同名,才可取到正确的值。
3、模式不会被赋值,切记模式匹配标识 " : " ,示例代码如下:

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

如上代码中,p是模式匹配(匹配等号右边对应属性),不会被赋值,x和y才是变量。
4、解构不成功:等号左边变量的值为undefined
二、默认值
1、对象属性值严格等于undefined,默认值生效。
2、对象属性值为null,默认值不生效。
3、如果解构模式是嵌套的对象,而且子对象所在的父属性不存在,那么将会报错。
4、解构赋值等号左边的模式之中没有变量声明关键字时,需要将整个赋值表达式放置到圆括号里。可以避免javascript将其解释为代码块。
5、对象解构赋值可以将现有对象的方法,赋值到某个变量。
6、数组是特殊对象,可以对数组进行对象属性的解构。

字符串的解构赋值

1、字符串可以解构赋值,因为它被转换成了一个类似数组的对象。

数值和布尔值的解构赋值

1、如果等号右边的值不是对象和数组,就会先将其转为对象,包括数值和布尔值。undefined和null无法转为对象,故不能进行解构赋值。

函数参数的解构赋值

1、同以上几种数据类型的解构

圆括号问题

一、不能使用圆括号的情况
1、变量声明语句
2、函数参数
3、赋值语句的模式
二、可以使用圆括号的情况
1、赋值语句的非模式部分,可以使用圆括号

赋值解构的用途

1、变换变量的值
2、从函数返回多个值
3、函数参数的定义
4、提取JSON数据
5、函数参数的默认值
6、遍历map结构
7、输入模块的指定方法

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值