持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第14天,点击查看活动详情
ES6中添加了一些运算符,使我们的开发更加方便,下面来看下这些运算的使用。
指数运算符(**)
ES6中新增的运算符**,也就是指数运算符,下面来看它的简单用法:
2 ** 3 // 8
上述中2 ** 3也就是代表2的3次方,也就是8,当然指数运算符可以多个一起连用,当其一起连用时,是从右边开始计算的,也就是说指数运算符是右结合,而不是左结合,指数运算符也可以和等号一起使用,如下例子所示:
2 ** 3 ** 2 // 512
let b = 3;
b **= 2; // 9
上述例子中,2 ** 3 ** 2运算相当于2 ** (3 ** 2),也就是从右边开始计算,先执行3 ** 2得到9,然后再执行2 ** 9,也就是512。第二个例子中,指数运算符与等号连用,相当于b = b ** 2,也是b = b * b,也就是3的平方9。
链判断运算符(?.)
开发中,我们在读取对象中的某个属性时,为了避免报错,首先会先判断一下对象是否存在,然后再取其属性,例如,obj&&obj.a这种写法,但如果要读取的属性嵌套太深,那么就会一直判断前一层对象是否存在,例如,obj&&obj.a&&obj.a.b&&obj.a.b.name,这种写法就比较冗余,现在ES6中新增了?.链判断运算符,用来简化这种写法,其主要有3种写法,如下:
- obj?.props
- obj?.[props]
- fun?.(...args)
其使用方法如下:
obj?.a?.b?.name
obj.back?.() //判断obj上back方法是否存在
这种写法在执行的时候,会先判断?.运算符左侧的对象是否是null或undefined,如果是后续就不再执行,反之就继续往下执行。
Null判断运算符(??)
开发时经常会遇到一种场景,当获取一个对象中的某个属性时,如果这个属性是null或者undefined,那么就需要为其指定一个默认值,以前我们一般使用||来进行实现,例如,const b = a.b || 2,但这样如果||左侧的值是false也会返回2,而??运算符只有当其左侧的值是null或者undefined时,才会返回其右侧的值,如下代码:
const data = {}
data.value ?? 1 // 1