本文旨在解决 JavaScript 中多维数组索引访问时可能遇到的 "Uncaught TypeError: Cannot read properties of null (reading .)" 错误。通过介绍可选链操作符，提供了一种优雅且安全的方式来检查多维数组中是否存在特定索引，避免因访问不存在的属性而导致程序崩溃。本文将详细解释可选链的使用方法，并提供示例代码，帮助开发者编写更健壮的 JavaScript 代码。
在 JavaScript 中处理多维数组时，经常需要访问嵌套较深的元素。然而，如果数组的某些层级不存在，直接访问这些不存在的属性会导致 "Uncaught TypeError: Cannot read properties of null (reading .)" 错误，从而中断程序的执行。 传统的 if 语句判断虽然可以避免错误，但当数组层级很深时，代码会变得冗长且难以维护。
使用可选链操作符（Optional Chaining）
可选链操作符 ?. 是一种简洁而强大的工具，可以安全地访问可能不存在的属性。它允许你在访问对象的属性时，如果遇到 null 或 undefined，会立即停止运算并返回 undefined，而不会抛出错误。
语法：
立即学习“Java免费学习笔记（深入）”；
object?.property object?.[expression] array?.[index] function?.(arguments)
示例：
AI 舌诊面诊问诊医疗系统 + 诊疗商城系统源码是一套结合 AI 辅助诊断与商品转化的健康类程序，基于浩创云、ThinkPHP（PHP）开发，支持微信服务号与 H5 端，适合做中医舌诊面诊问答、健康建议推送以及配套诊疗商品的运营。
假设我们有一个多维数组 array，需要访问 array[1][1][i][4][0][4][0][2][0]。使用可选链操作符，我们可以这样写：
for (var i = 0; i < array[1][1].length; i++) {
if(array?.[1]?.[1]?.[i]?.[4]?.[0]?.[4]?.[0]?.[2]?.[0]){
x[array[1][1][i][1]] =
array[1][1][i][4][0][4][0][2][0];
}
}在这个例子中，如果 array、array[1]、array[1][1]、array[1][1][i]、array[1][1][i][4]、array[1][1][i][4][0]、array[1][1][i][4][0][4]、array[1][1][i][4][0][4][0] 或 array[1][1][i][4][0][4][0][2] 中任何一个为 null 或 undefined，那么 array?.[1]?.[1]?.[i]?.[4]?.[0]?.[4]?.[0]?.[2]?.[0] 的结果将是 undefined，而不会抛出错误。if 语句的判断条件将为 false，从而避免了访问不存在的属性。
优势：
- 简洁性： 代码更加简洁易懂，避免了大量的 if 语句嵌套。
- 安全性： 确保在访问不存在的属性时不会抛出错误，提高了程序的健壮性。
- 可读性： 代码逻辑更加清晰，易于维护。
注意事项：
- 可选链操作符只适用于属性访问，不能用于赋值操作。例如，array?.[1] = 10; 是无效的。
- 可选链操作符的返回值可能是 undefined，因此在使用时需要注意类型判断。
总结：
可选链操作符是 JavaScript 中处理多维数组索引存在性问题的一种非常有效的工具。它可以简化代码，提高程序的健壮性，并使其更易于维护。在处理可能存在缺失属性的多维数组时，强烈建议使用可选链操作符来避免潜在的错误。
