js - - - - - 可选链操作符报错？可选链操作符 && lodash

Dark_programmer

已于 2023-03-30 16:44:58 修改

阅读量1.3k

点赞数

分类专栏： js 文章标签： javascript

于 2023-03-30 16:40:02 首次发布

本文链接：https://blog.csdn.net/Dark_programmer/article/details/129860085

版权

js 专栏收录该内容

48 篇文章

订阅专栏

可选链操作符报错？

关于可选链操作符，之前写过一篇文章，【关于可选链操作符(?.)】，如今旧项目又遇到新问题！

究其根本，要么是因为浏览器缓存、版本问题，要么是因为各种依赖的版本不支持es7新语法问题。

那么有没有一个不会出现这种问题的操作方式呢？ - - - - 答案就是：Lodash

可选链操作符 & Lodash.get

安装

yarn add lodash

引入lodash

import * as _ from “lodash”;

1. 数据结构存在:

      unknown_parameter: {
        first_floor: {
          second_floor: {
            secret: "he secret is hidden deep"
          }
        }
      }

分别使用两种方式进行获取secret

    console.log("方式1 使用可选链操作符: ", 
    	this.unknown_parameter?.first_floor?.second_floor?.secret || "He has no secrets"  );
    console.log( "方式2 使用lodash.get: ",  
    	_.get(this.unknown_parameter, "first_floor.second_floor.secret") ||  "He has no secrets" );

打印结果如下：
在这里插入图片描述

2. 数据结构不存在:

      unknown_parameter: {
        first_floor: {
          // second_floor: {
          //   secret: "he secret is hidden deep"
          // }
        }
      }

分别使用两种方式进行获取secret

    console.log("方式1 使用可选链操作符: ", 
    	this.unknown_parameter?.first_floor?.second_floor?.secret || "He has no secrets"  );
    console.log( "方式2 使用lodash.get: ",  
    	_.get(this.unknown_parameter, "first_floor.second_floor.secret") ||  "He has no secrets" );