快捷導(dǎo)航

JavaScript實(shí)現(xiàn)計(jì)算多維嵌套數(shù)組深度

更新時(shí)間：2023年06月04日 08:20:56 作者：??????????????????

在前端開發(fā)中，經(jīng)常會(huì)遇到需要處理多維嵌套的數(shù)據(jù)結(jié)構(gòu)，并需要計(jì)算出它們的深度，本文就來講講如何使用JavaScript實(shí)現(xiàn)計(jì)算多維嵌套數(shù)組深度吧

前言

在前端開發(fā)中，經(jīng)常會(huì)遇到需要處理多維嵌套的數(shù)據(jù)結(jié)構(gòu)。而對(duì)于這些多維嵌套的數(shù)據(jù)結(jié)構(gòu)，往往需要計(jì)算出它們的深度，用于方便后續(xù)處理。本文將介紹使用JavaScript實(shí)現(xiàn)計(jì)算多維嵌套數(shù)組深度的方法。

理論知識(shí)

在了解具體實(shí)現(xiàn)前，先來了解一下相關(guān)的理論知識(shí)：多維數(shù)組的深度。所謂數(shù)組的深度，就是指這個(gè)數(shù)組里面嵌套了多少層子數(shù)組。如下圖所示：

[1, 2, 3, 4]        // 深度為 1
[[1, 2], [3, 4]]    // 深度為 2
[[[1, 2], [3, 4]], [[5, 6], [7, 8]]]  // 深度為 3

可以看出，第一種情況只有一層，第二種情況有兩層，第三種情況有三層。

實(shí)現(xiàn)思路

根據(jù)上述定義，計(jì)算一個(gè)數(shù)組的深度其實(shí)就是遞歸遍歷每一層子數(shù)組，并不斷加一的過程。因此，我們可以采用遞歸的思想，實(shí)現(xiàn)如下：

function getDepth(arr) {
  if (!Array.isArray(arr)) {   // 判斷是否為數(shù)組
    return 0;
  }
  let depth = 1;               // 初始化深度為 1
  for (let i = 0; i < arr.length; i++) {
    const cur = arr[i];
    if (Array.isArray(cur)) {  // 如果當(dāng)前元素仍為數(shù)組，遞歸遍歷
      const curDepth = getDepth(cur) + 1;
      depth = Math.max(depth, curDepth);
    }
  }
  return depth;
}

上述代碼中，首先進(jìn)行了類型判斷，如果不是數(shù)組，則直接返回“0”；否則，逐層遍歷每一層子數(shù)組，通過遞歸調(diào)用函數(shù)計(jì)算出每個(gè)子數(shù)組的深度，并記錄最大深度。

實(shí)例演示

我們可以利用上述方法對(duì)以下多維嵌套數(shù)組進(jìn)行深度計(jì)算：

const arr1 = [1, 2, 3, 4];                  // 深度為 1
const arr2 = [[1, 2], [3, 4]];             // 深度為 2
const arr3 = [[[1, 2], [3, 4]], [[5, 6], [7, 8]]];  // 深度為 3
console.log(getDepth(arr1));                // 輸出 1
console.log(getDepth(arr2));                // 輸出 2
console.log(getDepth(arr3));                // 輸出 3

在控制臺(tái)輸出結(jié)果如下：

1
2
3

此外，我們還可以對(duì)一些嵌套層數(shù)較深的數(shù)組進(jìn)行計(jì)算：

const arr4 = [[[[1, 2], [3, 4]], [[5, 6], [7, 8]]],
              [[[1, 2], [3, 4]], [[5, 6], [7, 8]]]]; // 深度為 4
console.log(getDepth(arr4));                // 輸出 4

性能優(yōu)化

在實(shí)際開發(fā)中，如果處理的數(shù)據(jù)量很大，單純使用遞歸的方法可能會(huì)耗費(fèi)大量時(shí)間和內(nèi)存資源。因此，在設(shè)計(jì)算法時(shí)應(yīng)該盡可能地減少時(shí)間復(fù)雜度和空間復(fù)雜度。

以下是一些可能比較好的優(yōu)化方案:

方案一：隊(duì)列迭代

隊(duì)列迭代法同樣可以獲取多維嵌套數(shù)組的深度，而且有時(shí)候運(yùn)行速度更快。我們可以使用一個(gè)隊(duì)列來存儲(chǔ)每一層子數(shù)組，并不斷出隊(duì)并將其所有元素壓入隊(duì)列中，直到隊(duì)列為空為止。我們可以通過記錄隊(duì)列的大小來控制深度的增加，具體實(shí)現(xiàn)如下：

function getDepthByQueue(arr) {
  if (!Array.isArray(arr)) {  // 判斷是否為數(shù)組
    return 0;
  }
  let depth = 1;              // 初始化深度為 1
  const queue = [arr];        // 將初始數(shù)組放入隊(duì)列中
  while (queue.length) {      // 如果隊(duì)列不為空
    const curLevelSize = queue.length;
    for (let i = 0; i < curLevelSize; i++) {
      const cur = queue.shift();     // 出隊(duì)一個(gè)子數(shù)組
      if (Array.isArray(cur)) {
        queue.push(...cur);          // 將其中所有元素入隊(duì)
      }
    }  
    depth++;                        // 深度加一
  }
  return depth - 1;                 // 最后在隊(duì)列為空時(shí)，depth 多增加了一次，故需要減一
}

方案二：reduce計(jì)數(shù)

通過使用reduce方法，可以實(shí)現(xiàn)對(duì)多維嵌套數(shù)組的深度進(jìn)行計(jì)數(shù)。在這種方法里，我們只需要遍歷每一個(gè)元素，并讓其值等于當(dāng)前遞歸所得到的深度加一即可。

function getDepthByReduce(arr) {
  if (!Array.isArray(arr)) {   // 判斷是否為數(shù)組
    return 0;
  }
  return arr.reduce(function(pre, cur) {
    const curDepth = getDepthByReduce(cur) + 1;
    return Math.max(pre, curDepth);
  }, 1)
}

異常處理

在正常情況下，多維嵌套數(shù)組的深度是可以被正常計(jì)算的。但是在某些邊界條件下，我們需要對(duì)計(jì)算過程進(jìn)行異常處理：

邊界條件一：空數(shù)組

對(duì)于空數(shù)組，其深度為0。

console.log(getDepth([]));   // 輸出 0

邊界條件二：不是數(shù)組

如果傳入的值不是數(shù)組類型，返回0即可。

console.log(getDepth("test"));    // 輸出 0
console.log(getDepth({ a: 1 }));  // 輸出 0
console.log(getDepth(123));      // 輸出 0

邊界條件三：無限遞歸

在某些特殊情況下，可能會(huì)出現(xiàn)無限遞歸的錯(cuò)誤。例如一個(gè)由自己本身構(gòu)成的數(shù)組，此時(shí)就會(huì)導(dǎo)致函數(shù)陷入死循環(huán)。因此，在編寫代碼時(shí)需要避免這種惡性遞歸行為。

const test = [];
test.push(test);
console.log(getDepth(test));    // 此處會(huì)出現(xiàn)無限遞歸的錯(cuò)誤

為了避免無限遞歸的問題，可以設(shè)置一個(gè)計(jì)數(shù)器。當(dāng)函數(shù)調(diào)用次數(shù)超過一定值時(shí)，拋出異常并阻止遞歸的繼續(xù)進(jìn)行。

function getDepthWithLimit(arr, limit = 10000) {
  let count = 0;
  function calculateDepth(cur) {
    if (!Array.isArray(cur)) {
      return 0;
    }
    if (count++ > limit) {        // 超過極限次數(shù)則返回 Infinity
      throw new Error("too much recursive");
    }
    const curDepth = Math.max(...cur.map(calculateDepth)) + 1;
    return curDepth;
  }
  try {
    return calculateDepth(arr);
  } catch (e) {
    console.warn(e.message);
    return Infinity;
  }
}

在函數(shù)中增加計(jì)數(shù)器，每經(jīng)過一次遞歸就自增，如果達(dá)到某個(gè)條件（limit）就拋出異常，并阻止遞歸的執(zhí)行。最后用try...catch來捕獲異常。

結(jié)尾

我們可以看到使用JavaScript計(jì)算多維嵌套數(shù)組的深度十分方便。只需采用遞歸的思路，遍歷每一個(gè)子數(shù)組，并記錄最大深度即可。

但需要注意的是，在實(shí)際開發(fā)中，如果多維嵌套層數(shù)過深，會(huì)導(dǎo)致遞歸調(diào)用棧溢出的問題。因此，在實(shí)現(xiàn)該方法時(shí)需要考慮到性能優(yōu)化和異常處理。

以下是實(shí)現(xiàn)時(shí)的一些注意點(diǎn)：

盡量避免對(duì)傳入?yún)?shù)進(jìn)行修改，否則可能會(huì)影響其它部分代碼。
在遞歸過程中要注意邊界條件的處理，以防止無限遞歸或者數(shù)組越界的情況發(fā)生。
對(duì)于反復(fù)出現(xiàn)的計(jì)算結(jié)果可以進(jìn)行緩存，以提高代碼執(zhí)行效率。

到此這篇關(guān)于JavaScript實(shí)現(xiàn)計(jì)算多維嵌套數(shù)組深度的文章就介紹到這了,更多相關(guān)JavaScript嵌套數(shù)組內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: