javascript中的可选链操作符

本文主要是介绍javascript中的可选链操作符，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

可选链操作符?.可以安全的访问对象中嵌套的属性，即时属性不存在也不会报错

常规情况下，如果我们访问不存在的属性会报错

let user = {}; // a user without "address" propertyalert(user.address.street); // Error!

如果确实想访问属性怎么办，可以使用三元表达式

let user = {};alert(user.address ? user.address.street : undefined);

但是如果属性嵌套比较深，三元表达式将变得难以理解

let user = {}; // user has no addressalert(user.address ? user.address.street ? user.address.street.name : null : null);

为此我们可以使用短路运算符&&来优化

let user = {}; // user has no addressalert( user.address && user.address.street && user.address.street.name ); // undefined (no error)

为了简洁，用可选链语法

let user = {}; // user has no addressalert( user?.address?.street ); // undefined (no error)

如果属性存在正常返回值，如果属性不存在就返回undefined

除了用在属性上，可选链还可以用来调用不存在的方法

let userAdmin = {admin() {alert("I am admin");}
};let userGuest = {};userAdmin.admin?.(); // I am adminuserGuest.admin?.(); // nothing (no such method)

也可以用在删除属性上

delete user?.name; // delete user.name if user exists

但是不能用在赋值语句上

let user = null;user?.name = "John"; // Error, doesn't work
// because it evaluates to undefined = "John"

这篇关于javascript中的可选链操作符的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---