多维数组索引存在性检查：JavaScript 中的安全访问

本文旨在解决 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)

示例：

假设我们有一个多维数组 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 中处理多维数组索引存在性问题的一种非常有效的工具。它可以简化代码，提高程序的健壮性，并使其更易于维护。在处理可能存在缺失属性的多维数组时，强烈建议使用可选链操作符来避免潜在的错误。