可选连操作符用法

最新推荐文章于 2024-09-19 17:48:02 发布
最新推荐文章于 2024-09-19 17:48:02 发布
阅读量617 收藏
点赞数
分类专栏： vue 文章标签： javascript vue.js 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/QZ9420/article/details/121487708
版权
本文介绍了JavaScript中的可选链操作符(?.)，它允许开发者安全地访问深层对象属性，即使在路径中存在null或undefined也不会抛出错误。当与函数调用结合使用时，如果函数不存在，表达式会返回undefined。这种语法特性在处理可能缺失的数据时非常有用，可以防止程序因尝试访问不存在的属性而中断。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

可选链操作符( ?. )允许读取位于连接对象链深处的属性的值，而不必明确验证链中的每个引用是否有效。?. 操作符的功能类似于 . 链式操作符，不同之处在于，在引用为空(nullish ) (null 或者 undefined) 的情况下不会引起错误，该表达式短路返回值是 undefined。与函数调用一起使用时，如果给定的函数不存在，则返回 undefined。
使用场景：如图
在这里插入图片描述
控制台输出：
在这里插入图片描述

null、undefined和可选链操作符
低代码布道师的博客
08-19 2042
表示“无值”或“空值”。它是一个表示“没有对象”的原始值通常用于显式地表示一个变量应该有一个对象，但目前没有表示“未定义”或“缺失的值”。它是一个表示变量未被赋值的原始值当一个变量被声明但未被赋值时，或者一个函数没有返回值时，返回的就是 undefined熟悉以上的知识点，在表达式绑定和编写自定义代码的时候会非常有用，有时候感觉逻辑写不出来，主要是一些必须掌握的知识点不熟悉导致的。
【vue2】vue项目使用可选链?.操作符报错Cannot read properties of undefined【已解决】
我的开源项目:https://gitee.com/derekgo/vue-cms_xg
07-19 1183
沉默小管 vue项目使用可选链?.操作符报错Cannot read properties of undefined
可选链操作符的使用
weixin_48969871的博客
11-01 728
官网定义： 可选链操作符(?.)允许读取位于连接对象链深处的属性的值，而不必明确验证链中的每个引用是否有效。?.操作符的功能类似于.链式操作符，不同之处在于，在引用为空(nullish)(null或者undefined) 的情况下不会引起错误，该表达式短路返回值是undefined。与函数调用一起使用时，如果给定的函数不存在，则返回undefined。 优点：当尝试访问可能不存在的对象属性时，可选链操作符将会使表达式更短、更简明。在探索一个对象的内容时，如果不能确定...
4个优雅的JavaScript运算符使用技巧
JWT的博客
04-30 260
ECMAScript发展进程中，会有很多功能的更新，比如销毁，箭头功能，模块，它们极大的改变JavaScript编写方式，可能有些人喜欢，有些人不喜欢，但像每个新功能一样，我们最终会习惯它们。 新版本的ECMAScript引入了三个新的逻辑赋值运算符：空运算符，AND和OR运算符，这些运算符的出现，也是希望让我们的代码更干净简洁，下面分享几个优雅的JavaScript运算符使用技巧 一、可选链接运算符【？.】 可选链接运算符（Optional Chaining Operator） 处于ES2020提案的第4
js中的 可选链操作符、空值合并操作符、空值赋值运算符、非空断言操作符
qq_44376306的博客
02-22 3080
1.可选链操作符( ?.) const adventurer = { name: 'Alice', cat: { name: 'Dinah' } }; const dogName = adventurer.dog?.name; console.log(dogName); // expected output: undefined console.log(adventurer.someNonExistentMethod?.()); // expected output: undef.
javascript可选操作符 (?.)
qq_38110572的博客
06-15 2546
?. 语法在ES2020 中被引入，用法如下： obj.val?.pro // 如果`val`存在，则返回`obj.val.prop`，否则返回 `undefined`。 obj.func?.(args) // 如果 obj.func 存在，则返回 `obj.func?.(args)`，否则返回 `undefined`。 obj.arr?.[index] // 如果 obj.arr 存在，则返回 `obj.arr?.[index]`，否则返回 `undefined`。 //假设我们有一个对象 let
js 简单实现可选链操作符
05-26
可选链操作符( ?. )允许读取位于连接对象链深处的属性的值，而不必明确验证链中的每个引用是否有效。?. 操作符的功能类似于 . 链式操作符，不同之处在于，在引用为空(nullish ) (null 或者 undefined) 的情况下不会...
ts ?: 是可选属性操作符
seimeii的博客
08-23 582
ts ?: 是可选属性操作符
python使用点操作符访问字典(dict)数据的方法
12-23
`allowDotting`方法是一个可选功能，它允许用户切换是否启用点操作符访问。当`state=True`时，启用点操作符访问；反之，当`state=False`时，将禁用点操作符访问，恢复到标准的字典行为。 例如： ```python d = ...
Swift基础教学：掌握选并操作符的使用方法
基本操作符系列是学习Swift语言不可或缺的基础部分，而“选并操作符”（也称为“三元条件操作符”或“三元运算符”）是其中一种简洁表达条件语句的操作符。 在Swift中，三元操作符是唯一的三元操作符，它的格式为：...
JavaScript 36 ，JavaScript 可选链操作符：深度解读与实战应用（ JS可选链操作符，JS中的可选链操作符）
最新发布
weixin_65793170的博客
09-19 2720
⭐在前端开发中，我们经常会遇到访问嵌套对象属性的需求。然而，处理深层嵌套对象时，属性可能为 undefined 或 null，直接访问这些属性时会抛出错误。为了解决这种问题，JavaScript在ES2020中引入了一项新特性——可选链操作符（?.）。它不仅简化了代码逻辑，还提升了代码的健壮性和可读性。这里来分享记录，可选链操作符的语法、应用场景及其与其他JavaScript特性的结合使用，并通过多个实际例子展示如何在日常开发中充分利用这一特性。
可选链操作符 ?.
qq_48557089的博客
04-20 1089
可选链操作符 ?. 允许读取位于连接对象链深处的属性的值，而不必明确验证链中的每个引用是否有效。 此方法不兼容IE浏览器 一、语法 obj?.prop // 对象属性是否存在 obj?.[expr] // 同上 arr?.[index] // 数组元素是否存在 func?.(...args) // 函数或对象方法是否存在 二、基本用法 1. 查找一个深度嵌套的可能不存在的子属性时 let nestedProp = obj.first && obj.first.second; // 代.
操作符练习
Amoralmmm的博客
07-29 155
1.写一个函数返回参数二进制中 1 的个数，比如： 15 0000 1111 4 个 1 #include<stdio.h> #include<stdlib.h> int main() { int num = -1; int i = 0; int count = 0; for (i = 0; i < 32; i++) { if (((num >&...
【JavaScript】可选链操作符
小秀的博客
08-08 784
可选链操作符（Optional Chaining Operator）是一种 JavaScript/TypeScript 中的语法特性，用于简化对可能为空或未定义的属性或方法的访问。在访问一个对象的属性或方法时，通常需要先检查该对象是否为 null 或 undefined，以避免产生错误。可选链操作符的优点在于它简化了对多层嵌套属性或方法的访问，避免了手动进行非空判断的繁琐性。为 null 或 undefined，那么。将为 undefined，而不是抛出错误。
可选链 ?.
叮当的猫猫的博客
10-27 2321
一、可选链三种语法形式 1.obj ?.prop. --------如果obj 存在则返回 obj.prop ,否则返回 undefined。 2.obj ?.[prop] -------如果存在则返回obj[prop] ，否则返回undefined。 3.obj.method?.()------如果obj.method 存在则调用obj.method(),否则返回undefined。 正如我们所看到的，这些语法形式用起来都很简单直接，检查左边部分是否为 null/undefined，如果不是则继续
可选链操作符
無業䢟民的博客
03-05 423
简介 可选链操作符( ?. )允许读取位于连接对象链深处的属性的值，而不必明确验证链中的每个引用是否有效。?. 操作符的功能类似于 . 链式操作符，不同之处在于，在引用为空(nullish ) (null 或者 undefined) 的情况下不会引起错误，该表达式短路返回值是 undefined。与函数调用一起使用时，如果给定的函数不存在，则返回 undefined。 当尝试访问可能不存在的对象属性时，可选链操作符将会使表达式更短、更简明。在探索一个对象的内容时，如果不能确定哪些属性必定存在，可选链操作符也
【JS】可选链操作符(?.)及其使用方法与场景
owo_ovo的博客
09-08 3691
介绍ES6+的可选链操作符是什么？怎么用？为什么要用？相比原始&&写法的优势。
可选链操作符 ?.的用法
金木AI
09-18 208
可选链操作符（Optional Chaining Operator）是 ECMAScript 2020（ES11）引入的一项功能，用于更安全地访问对象的属性或方法。这个操作符的主要目的是处理在访问嵌套对象的属性或方法时，可能会遇到 null 或 undefined 值的情况，以防止抛出错误。这在处理复杂的对象结构、从外部数据源获取数据或执行可选的操作时非常有用，可以简化代码并提高代码的健壮性。可选链操作符的语法形式是?.，可以用来代替传统的访问操作符 .。
ES6+ 可选链操作符
很酷的站长的博客
01-03 1424
上面的代码中，obj 是一个对象，在获取 obj 对象的属性 a 时，属性 a 没有被定义所以返回 undefined，第 3 行获取 obj 对象 a 下的 b，由于 obj 上没有 a 属性，再获取 a 上的 b 属性就会报错。一般这样的情况，在程序中需要做前置验证，大部分情况会借助&&来完成。上面的代码中第 2 行首先会判断obj.a的值，如果不为空则继续执行obj.a.b否则返回undefined。
js 可选链操作符
05-25
JavaScript 的可选链操作符（Optional Chaining Operator）是一种新的语言特性，它可以让我们在访问对象的属性或方法时，不必担心访问的对象是否为 null 或 undefined。这个操作符是一个问号（?）和一个点号（.）组成的。它的语法形式如下： ``` obj?.prop // 访问 obj.prop，如果 obj 为 null 或 undefined，则返回 undefined obj?.[expr] // 访问 obj[expr]，如果 obj 为 null 或 undefined，则返回 undefined arr?.[index] // 访问 arr[index]，如果 arr 为 null 或 undefined，则返回 undefined func?.(args) // 调用 func(args)，如果 func 为 null 或 undefined，则返回 undefined ``` 下面是一个例子： ``` const user = { name: 'Alice', address: { city: 'Shanghai', street: 'Nanjing Road' } }; console.log(user?.address?.city); // 'Shanghai' const user2 = null; console.log(user2?.address?.city); // undefined ``` 在上面的例子中，我们使用可选链操作符来访问 user 对象的 address 对象的 city 属性。即使 user 对象为 null 或 undefined，也不会抛出异常，而是返回 undefined。 需要注意的是，可选链操作符是 ES2020（也称为 ES11）引入的新特性，因此在一些老的浏览器和 Node.js 版本中可能不支持。如果要使用可选链操作符，需要确保你的运行环境支持它。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值