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

原创 已于 2023-03-30 16:44:58 修改 · 1.4k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#javascript

于 2023-03-30 16:40:02 首次发布
文章讨论了在JavaScript中使用可选链操作符时可能遇到的浏览器兼容性和依赖版本问题。为了解决这些问题，作者推荐使用Lodash库中的_.get方法来安全地访问深层对象属性。通过示例比较了两种方法在数据结构存在和不存在时的表现，显示了_.get的稳健性。

可选链操作符报错？

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

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

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

可选链操作符 & Lodash.get

安装

yarn add lodash

引入lodash

import * as _ from “lodash”;

1. 数据结构存在:

      unknown_parameter: {
   
   
        first_floor: {
最低0.47元/天 解锁文章
Vue及Element UI&vue-element-admin简记
生活在别处
11-21 8525
文章目录概念索引安装vue基本语法声明式渲染动态参数双向绑定数据绑定中进行数据处理使用JS表达式计算属性侦听器Class 与 Style 的数据绑定Class的数据绑定Style的数据绑定条件与循环条件渲染v-if指令v-show指令列表（数组）渲染数据更新检测事件监听器修饰符事件修饰符按键修饰符按键码系统修饰键指令的缩写组件化应用构建vue实例实例生命周期的钩子模板语法高级语法相关概念HTML ...
day18JS+Node-微任务、宏任务和node.js
kwj258036的博客
09-10 921
简单介绍了怎么区分微任务和宏任务，node.js的语法和node的API
express项目中?.可选链操作符写法报错
qq_44739238的博客
01-14 517
今天拉了一个简单的express项目，启动的时候?查了一下发现是因为express官网上给的javascript标准为es5,是不能直接跑es6的，想要在express中使用es6写法，需要用转码器Babel进行转码。.操作符报错的问题。.操作符报错的问题，需要进一步配置 Babel 插件@babel/plugin-proposal-optional-chaining来支持。在 package.json 文件中添加一个 script，告诉 Node.js 使用 Babel 来运行你的应用程序。
JavaScript 防止崩溃的可选链
且听风吟的博客
11-03 339
在开发过程中需要拿到一个嵌套比较深的属性的值，需要做很多的判断，例如： const obj = { name: "xiaoming", age: 27, address: { province: { city: 'hangzhou' } } } 要拿到 obj 对象中 city 属性的值，需要判断 4 次看每一层是否有值： const city = (obj && obj.address && obj.address.pr
JavaScript报错“Cannot read property of undefined“？可选链的兼容性方案
最新发布
shejizuopin的博客
10-17 946
摘要：本文深入解析JavaScript中Cannot read property of undefined报错的解决方案，重点介绍ES2020可选链操作符（?.）的革新性突破。通过对比传统条件判断与可选链的代码差异，分析各浏览器兼容性及转译方案（Babel/TypeScript），提供实战代码示例和性能数据。同时给出企业级项目兼容策略、最佳实践建议及未来演进方向，帮助开发者有效减少空值错误，提升代码可读性和维护性。
js可选操作符?.解决调用值报错问题
月_YUE的博客
05-23 739
用户切换身份权限，点击菜单无反应。原因：session的变量以及属性值，只有在用户点击对应的页面才会被初始化。用户未点击该页面前，先执行路由拦截的流程，引用了存储在session中未被定义的对象属性值，导致进程被阻塞，无法执行权限切换逻辑。
vue-使用可选链操作符编译报错问题
qq_42164957的博客
10-11 4501
vue-使用可选链操作符编译报错问题
关于可选链操作符(?.)
Dark_programmer的博客
10-29 1198
javaScript越更新，越贴近、方便开发者。 大家肯定写过类似的语法： let length = (res && res.data && res.data.length) || 0 这种代码，看起来不是很美观，而且啰哩啰嗦的。那么有没有更简洁、方便的方式呢？ 当然！！那就是 可选链操作符?. 将上述代码使用 可选链操作符?. 改写如下： let length = res?.data?.length || 0 有没有感觉用起来很舒服呢？ 但是越新颖的语法，对于浏览器
vue2 怎么支持可选连操作符
05-09
好的，我现在需要回答用户关于在Vue2中如何使用可选链操作符的问题，以及实现方法或替代方案。首先，我需要确认Vue2是否原生支持可选链操作符。因为Vue2通常基于ES5或ES6标准，而可选链是ES2020引入的特性，所以可能...
npm run test编译失败 js可选链报错?.
well_kk的博客
11-02 1206
参考文章：https://www.youkuaiyun.com/tags/NtDakg5sNDA4MDItYmxvZwO0O0OO0O0O.html。大概意思就是需要装loader来解决可选链的报错信息。在网上找了好久，发现这类文章比较少，特此记录。完成，再执行 npm run test即可完成打包。1、babel.config.js添加如下内容。先上我的报错信息，看看是否一样？2、安装编译可选链的包。
vue2.X使用可选链操作符编译报错问题
十一
05-16 1635
可选链操作符是ES2020中推出的新语法，允许我们不需要校验当前属性的类型去尝试访问子属性。.c?.dnpm install --save-dev @babel/plugin-proposal-optional-chaining -S //解析可选链语法插件npm install --save-dev @babel/plugin-proposal-nullish-coalescing-operator // 双问号语法插件。
js可选链使用时报错Support for the experimental syntax ‘chaining‘ isn‘t currently enabled 问题记录-安装bable依赖及配置
yh8899abc的博客
09-18 5710
问题回顾 vue2 项目中使用了可选链 let a = videoInfo?.videoUrl ?? ''; 然后就报错 解决方案 // 首先安装babel npm install --save-dev @babel/core @babel/cli @babel/preset-env // 安装 npm i @babel/plugin-proposal-optional-chaining --save-dev // 或者安装指定版本（与上面一条二选一） npm install @babel/plug
vue template 里使用可选链操作符( ?. )报错：Errors compiling template:invalid expression: Unexpected token ‘.‘ i
学习前端这门手艺，栈底到栈顶依次是：浏览器架构、Web 网络、事件循环机制、JavaScript 核心、V8 的内存管理、浏览器的渲染流程、Web 安全、CSS、React、Vue、Node、构建工具链等
09-08 1万+
template 不支持可选链操作符，在可以升级 vue 版本的情况下，我们可以升级到。以上的几种版本都是可以的，安装切换完版本，然后运行服务，即可。一定要确定好 vue 版本的问题，可以去依赖里面看看版本，，在 vue template 里使用。大家也可以测试其他的版本，我试了一下。版本，同时 node 版本升级到。在 script 里添加是不报错的。然后通过 nvm 工具切换版本到。我也测试了一下，也是可行的。我使用的node 版本是。这个问题主要是 vue。
vue2中使用可选链（?. ??）操作符报错
weixin_47375788的博客
08-13 2664
在ECMAScript 2020 (ES11) 中被引入，用于在尝试访问对象深层属性时避免抛出错误。如果你的Vue项目运行在不支持这些新特性的JavaScript环境中，你会遇到语法错误。在Vue 2中，如果你遇到使用可选链 (Optional Chaining) 操作符?时出现错误，很可能是因为你的项目使用的JavaScript环境不支持这些特性。）操作符，如果是vue2.0的项目则需要安装插件解析：babel-plugin-proposal-optional-chaining。
【vue-cli】使用es6的可选链?.操作符报错Module parse failed解决记录
热门推荐
向着光芒的女孩
07-30 1万+
使用场景：发现项目有些旧代码多层调用某个对象的属性，由于目标对象可能没那个属性，就导致报错，之前研究es6新特性时发现可以用?.来判断某个对象是否有某个属性来赋值。 测试源代码： var a = { name: 'hello' } var b = a?.name; console.log('a',a,'b',b) 在vue-cli中发现用不了： 后面尝试去解决，成功后浏览器控制台能打印出来 解决过程 因为我们这个项目是用的vue-element-admin,我自己在另外一个vue-cli工程.
js中的可选链操作符?.
qq_40728708的博客
01-13 447
js中的可选链操作符?. 如果表达式坐标的值为null或者undefined时，那么该表达式将短路返回值undefined，即不用去判断该对象是否有某一个属性，节省了代码量。 if( this.info && this.info.content ) { console.log(this.info.content); } 如上代码所示，若this中没有info，则会报错。我们利用js中的可选链操作符则直接返回undefined，而不用去判断是否有该属性。 console.log(this.
vue项目使用可选链操作符编译报错问题
m0_57594854的博客
11-25 3343
可选择链操作符报错
vue2中template里使用可选链操作符( ?. )报错解决方案
qq_44741577的博客
04-30 2837
版本，同时 node 版本升级到。不支持可选链操作符，升级。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值