可选链 空位合并运算符

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 可选链  
        /* 
        可选链操作符( ?. )允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效。
        ?. 操作符的功能类似于 . 链式操作符,不同之处在于,在引用为空(nullish ) (null 或者 undefined) 的情况下不会引起错误,
        该表达式短路返回值是 undefined。与函数调用一起使用时,如果给定的函数不存在,则返回 undefined。
        当尝试访问可能不存在的对象属性时,可选链操作符将会使表达式更短、更简明。
        在探索一个对象的内容时,如果不能确定哪些属性必定存在,可选链操作符也是很有帮助的。
         */
        //数组
        const list = [1, 2, 3]
        if (list && list.length) {
            console.log('数组存在,且有长度');
        }
        if (list?.length) {
            console.log('使用可选链判断数组');
        }
        console.log(list?.[2]);  //3
        // 对象
        let obj = {
            cat: {
                name: 'tom'
            },
            dog: {
                name: 'jenny'
            }
        }
        if (obj && obj.dog && obj.dog.name) {
            console.log('对象中有dog属性,且name是jenny');
        }
        if (obj?.dog?.name) {
            console.log('用可选链判断dog属性存在,且获得名字name');
        }
        const dogName = obj?.dog?.name
        console.log(dogName); //jenny

        //函数
        const fun = () => {
            console.log('我是函数');
        }
        // fun && fun()
        fun?.()


        //空位合并运算符 ??
        /* 当我们判断变量可以为 0 '' false 且保留的场景时候 
        只有当前面为null或者undefined的时候,会进行空值合并操作,就是赋予后面设定的默认值。
         */
        console.log('' || 'gyb');  //gyb
        console.log('' ?? 'gyb'); // ''  使用空位合并云算法就可以保留空字符串存在的比较
        console.log(0 ?? 'gyb');  //0
        console.log(false ?? 'gyb');  //false 
        console.log(null ?? 'gyb');  //gyb 
        console.log(undefined ?? 'gyb');  //gyb 




    </script>
</body>

</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值