前端数据结构与算法：图的遍历详解

前端

2024-01-06 12:09:01

在计算机科学中，图是一种重要的数据结构，用于表示对象之间的关系。图的遍历是一种基本算法，它允许我们访问图中的所有顶点。

图的遍历

图的遍历从图中某个顶点出发，沿图中的路径依次去访问图中的所有顶点，使得每一个顶点刚好被访问一次，这一过程就叫做图的遍历。对图进行遍历，最常见到的两个算法是广度优先搜索（BFS）和深度优先搜索（DFS）。

广度优先搜索 (BFS)

BFS是一种按层次遍历图的算法。从起始顶点开始，BFS首先访问与起始顶点相邻的所有顶点，然后访问与这些相邻顶点相邻的所有顶点，以此类推。

深度优先搜索 (DFS)

DFS是一种沿着一条路径深入遍历图的算法。从起始顶点开始，DFS首先访问与起始顶点相邻的一个顶点，然后访问与该相邻顶点相邻的一个顶点，以此类推。如果当前路径上没有相邻顶点未被访问，DFS会回溯到上一个未访问的顶点并继续遍历。

在前端开发中的应用

图的遍历在前端开发中有着广泛的应用，例如：

社交网络中的好友关系图
文件系统中的目录结构图
路径查找和导航图

JavaScript 实现

在 JavaScript 中，我们可以使用以下代码实现 BFS 和 DFS：

// 广度优先搜索
function BFS(graph, start) {
  const queue = [start];
  const visited = new Set();
  while (queue.length > 0) {
    const vertex = queue.shift();
    if (visited.has(vertex)) continue;
    visited.add(vertex);
    console.log(vertex);
    graph[vertex].forEach(neighbor => {
      if (!visited.has(neighbor)) queue.push(neighbor);
    });
  }
}

// 深度优先搜索
function DFS(graph, start) {
  const stack = [start];
  const visited = new Set();
  while (stack.length > 0) {
    const vertex = stack.pop();
    if (visited.has(vertex)) continue;
    visited.add(vertex);
    console.log(vertex);
    graph[vertex].forEach(neighbor => {
      if (!visited.has(neighbor)) stack.push(neighbor);
    });
  }
}