首页 >web前端 >js教程 >如何避免 JavaScript 中'无法读取未定义的属性”错误?

如何避免 JavaScript 中'无法读取未定义的属性”错误?

Mary-Kate Olsen
Mary-Kate Olsen原创
2024-12-23 01:26:091053浏览

How Can I Avoid

避免“无法读取未定义的属性”错误

使用复杂的数据结构时,经常会遇到与未定义属性相关的错误。考虑以下示例:

// This array contains a mix of nested objects and non-nested values
var test = [{'a':{'b':{'c':"foo"}}}, {'a': "bar"}];

访问可能不存在的嵌套对象的属性时,迭代测试可能会导致错误。例如,以下代码在访问 a.b.c 时会抛出错误:

for (i=0; i<test.length; i++) {
    console.log(a.b.c); // Throws error on i==1
}

为了避免此类错误,可以使用多种方法:

可选链接 (ES2020 ) 和 TypeScript 3.7

更新:对于现代浏览器和 TypeScript,推荐的解决方案是可选链 (?.) 运算符:

obj?.a?.lot?.of?.properties

基于函数的解决方法(ES2020 之前和 TypeScript 3.7 之前)

一个简单的解决方法是使用助手function:

function getSafe(fn, defaultVal) {
  try {
    return fn();
  } catch (e) {
    return defaultVal;
  }
}

// Use the function to access the property safely
console.log(getSafe(() => obj.a.lot.of.properties));

此函数返回调用所提供函数的结果,如果发生错误,则返回默认值。使用这种方法,您可以避免错误并有条件地访问嵌套属性:

console.log(getSafe(() => obj.a.lot.of.properties, 'nothing'));

以上是如何避免 JavaScript 中'无法读取未定义的属性”错误?的详细内容。更多信息请关注PHP中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn