JS如何实现广度优先搜索？BFS的应用-js教程-PHP中文网

JS如何实现广度优先搜索？BFS的应用

煙雲

发布： 2025-08-18 08:58:01

原创

599人浏览过

JS实现广度优先搜索（BFS）的核心在于使用队列逐层遍历图或树，结合visited集合避免重复访问，其典型应用包括无权图最短路径、社交网络连接、Web爬虫和迷宫求解，与DFS相比，BFS适合寻找最短路径和层级遍历，而DFS更适合遍历所有路径或处理深度较深的图，优化BFS的方法包括双向BFS、使用优先队列处理带权图、提升队列操作效率以及提前终止搜索，这些策略扩展了BFS在复杂场景下的适用性。

js如何实现广度优先搜索？bfs的应用

JS实现广度优先搜索（BFS）的核心，在于它探索图或树的方式：一层一层地往外扩散。想象一下水波纹，从中心点开始，先触及最近的，然后是次近的，以此类推。在代码层面，这通常意味着你需要一个队列（queue）来管理待访问的节点，并用一个集合（set）或布尔数组来记录哪些节点已经被访问过，避免重复和死循环。

要用JavaScript实现BFS，我们得先有个图结构。最常见的，也是我个人偏爱的，是邻接列表（adjacency list），用一个Map或者对象来表示每个节点及其邻居。

假设我们有这样一个图：

const graph = {
  'A': ['B', 'C'],
  'B': ['D', 'E'],
  'C': ['F'],
  'D': [],
  'E': ['F'],
  'F': []
};

登录后复制

BFS算法本身其实挺直观的：

初始化：创建一个队列，把起始节点放进去。同时，用一个
```
visited
```
登录后复制
集合记录已访问过的节点，把起始节点也加进去。
循环：只要队列不为空，就一直循环。
出队：从队列头部取出一个节点（当前节点）。
处理：对当前节点进行你需要的操作（比如打印它，或者检查它是不是目标节点）。
入队：遍历当前节点的所有邻居。如果某个邻居还没被访问过，就把它标记为已访问，并加入队列尾部。

function bfs(graph, startNode) {
  const queue = [startNode]; // 队列，存放待访问节点
  const visited = new Set(); // 记录已访问节点，避免重复访问和死循环
  visited.add(startNode);

  const result = []; // 存放遍历结果，可选，用于展示遍历顺序

  while (queue.length > 0) {
    const currentNode = queue.shift(); // 队头出队
    result.push(currentNode); // 处理当前节点，这里是将其加入结果数组

    // 遍历当前节点的所有邻居
    for (const neighbor of graph[currentNode]) {
      if (!visited.has(neighbor)) { // 如果邻居未被访问过
        visited.add(neighbor); // 标记为已访问
        queue.push(neighbor); // 入队
      }
    }
  }
  return result;
}

// 示例调用
// console.log(bfs(graph, 'A')); // 预期输出: [ 'A', 'B', 'C', 'D', 'E', 'F' ]

登录后复制

这段代码，说白了，就是模拟了水波纹扩散的过程。队列是波纹的前沿，

visited

登录后复制

集合则防止波纹倒流或重复。

广度优先搜索在哪些实际场景中大显身手？

BFS的魅力在于它“一层层”探索的特性，这让它在很多地方都显得特别有用。我个人觉得，最典型的应用就是寻找无权图中的最短路径。因为它是按层级推进的，所以一旦找到了目标节点，那条路径必然是最短的（边的数量最少）。这不像深度优先搜索（DFS），DFS可能会一头扎到某个分支的尽头，找到的路径不一定是最短的。

举几个例子：

社交网络中的最短连接路径：比如你想知道你和某个明星之间隔了多少个“朋友的朋友”，BFS就是理想选择。从你开始，一层层向外找，直到找到那个明星。
Web爬虫：当爬虫从一个起始页面开始，需要发现所有链接的页面时，BFS可以确保它按“距离”顺序访问页面。这对于构建搜索引擎索引或者数据抓取都很有用。
迷宫求解：如果迷宫的每个格子都是一个节点，相邻的格子之间有边，那么从起点到终点的最短路径，BFS可以轻松搞定。
垃圾回收（Garbage Collection）：在某些垃圾回收机制中，BFS被用来标记所有可达的对象，那些不可达的对象就是可以被回收的“垃圾”。

这些场景都有一个共同点：它们关心的是“最近”或“最少步数”能到达哪里，而不是“所有可能”的路径。

纳米搜索

纳米搜索：360推出的新一代AI搜索引擎

查看详情

BFS与DFS有何不同？何时选择BFS而非DFS？

这是个老生常谈但又不得不提的问题。BFS和DFS就像图遍历领域的两把刷子，各有各的用武之地。

核心区别：

探索方式：BFS是“横向”探索，一层一层地走；DFS是“纵向”探索，一条路走到黑，碰壁了再回头。
数据结构：BFS用队列（先进先出），DFS用栈（先进后出，或者递归调用的函数栈）。
路径特性：在无权图中，BFS找到的路径天然就是最短路径；DFS则不保证。

何时选择BFS？

寻找最短路径：如前所述，这是BFS的杀手锏。只要图是无权的，或者所有边的权重都一样，BFS就是不二之选。
需要层级遍历：如果你需要按距离或层级来处理节点，比如查找某个层级的所有节点，或者限制搜索深度，BFS更合适。
内存考虑（有时）：当图的深度非常大但宽度相对较小时，BFS的队列可能比DFS的递归栈占用更少的内存。但反过来，如果图非常宽，BFS的队列可能会变得非常大，导致内存溢出。这是个权衡。

何时选择DFS？

遍历所有路径：如果你需要找到所有从A到B的路径，或者遍历图的所有连通分量，DFS通常更简洁。
拓扑排序：某些图的拓扑排序问题，DFS是更自然的实现方式。
寻找连通分量或环：DFS在检测图的连通性、寻找环等方面也很有用。
内存考虑（有时）：当图的宽度非常大但深度有限时，DFS的栈深度可能比BFS的队列小，从而节省内存。

说白了，看你问题的本质：是想“最快到达”还是“遍历所有可能”？是“广度优先”还是“深度优先”？选择合适的工具能事半功倍。

如何优化BFS的性能或处理复杂图结构？

虽然基本的BFS算法已经很强大，但在面对一些复杂场景时，我们还是可以做些思考和优化。

双向BFS (Bidirectional BFS)：当你知道起点和终点时，可以尝试从起点和终点同时开始进行BFS。当两个搜索前沿相遇时，就找到了最短路径。这在某些情况下能显著减少搜索的节点数量，因为搜索空间从一个大圆变成了两个相交的小圆，面积（节点数）之和可能远小于单个大圆。实现上，你需要两个队列和两个
```
visited
```
登录后复制
集合，分别用于正向和反向搜索。这有点像两个人从两头往中间挖隧道，比一个人从一头挖要快。
处理带权图 (Weighted Graphs)：标准的BFS只适用于无权图的最短路径。如果图的边有权重，你就不能直接用BFS了。这时候，你需要Dijkstra算法（基于优先队列的BFS变体）或者Bellman-Ford算法。它们能处理带权图的最短路径问题，但复杂度会更高。这算是对BFS的一个扩展思考，它告诉你，BFS并非万能，但它的思想是很多高级算法的基石。
处理大型图的内存效率：如果图非常大，尤其是宽度非常大时，BFS的队列可能会消耗大量内存。在JavaScript中，数组作为队列，
```
shift()
```
登录后复制
操作的性能在大型数组上会下降（因为它需要重新索引所有元素）。这时，可以考虑使用链表结构来模拟队列，或者使用更高效的队列库，以提高
```
enqueue
```
登录后复制
/
```
dequeue
```
登录后复制
的效率。当然，如果图真的大到内存都装不下，那可能就需要分布式图处理框架了，但那是另一个层面的问题了。
避免不必要的遍历：在某些应用中，你可能只需要找到第一个符合条件的节点，一旦找到就立即停止搜索。这虽然不是算法本身的优化，但可以有效减少不必要的计算。