前端-JS获取对象属性需先判空

最新推荐文章于 2025-05-22 14:56:03 发布

原创最新推荐文章于 2025-05-22 14:56:03 发布 · 711 阅读

0 ·

CC 4.0 BY-SA版权

javaScript 专栏收录该内容

14 篇文章

订阅专栏

本文探讨了前端开发中对接口返回数据进行非空校验的重要性，介绍了使用TypeScript的可选链操作符和Lodash的get方法进行安全属性访问的方法，确保前端应用的稳定性和健壮性。

前端开发，在接口约定基础上，必须对对用的对象做非空校验，来保证前端代码的健壮性

参考：阮一峰《ES6入门》链判断运算符

1. TypeScript 3.7 Optional Chaining

       const data = {product:{productId:12},order:null}
       const productId  = data?.product?.productId     //12
       const orderId = data?.order?.orderId    //Undefined

2.Lodash

       const data = {product:{productId:12},order:null}
       const productId  = _.get(data,"product.productId")  //12
       const orderId = _.get(data,"order.orderId")  //Undefined

optional chaining 的应用场景

obj?.prop       // optional static property access
obj?.[expr]     // optional dynamic property access
func?.(...args) // optional function or method call