--这是广度优先还是深度优先搜索的例子？

Question

这是一个遍历整个文档对象模型的简单函数。我想了解这是广度优先还是深度优先以及如何理解原因：

var traverseDOM = function () {
  function traverse (parent) {
    // mark 1
    _(parent.childNodes).forEach((child) => {
      traverse(child);
    }
    // mark 2
  }
  traverse(document.body);
}

这似乎是来自此相关SO Post 的深度优先搜索。

可以根据wikipedia进一步分类。

InOrder、PreOrder 和 PostOrder。

Answer 1

考虑以下树：

你从traverse(1)开始：

traverse(1)

在“标记 1”之后，该方法将开始循环遍历所有子节点，为每个子节点调用 traverse。第一个，traverse(1.1)，将“介入执行”：

traverse(1)
traverse(1.1)

当traverse(1.1)点击“标记1”时，它将开始处理它的个孩子并调用traverse(1.1.1)：

traverse(1)
traverse(1.1)
traverse(1.1.1)

由于“1.1.1”没有子级，traverse(1.1.1)到达“标记2”，执行流程将返回父方法forEach的循环traverse(1.1)：

traverse(1)
traverse(1.1)

循环继续并为第二个孩子“1.1.2”调用traverse：

traverse(1)
traverse(1.1)
traverse(1.1.2)

处理完“1.1”的两个孩子之后，traverse(1.1) 到达“标记 2”，现在执行流程又回到了traverse(1) 的forEach 循环中：

traverse(1)

继续“1.2”：

traverse(1)
traverse(1.2)

我会在这里停下来，但你应该掌握它的窍门。您可以看到“1.1.1”和“1.1.2”在之前“1.2”被访问，使其成为深度优先搜索。广度优先搜索会在“1.1.1”之前访问“1.2”和“1.3”。

Answer 2

正如尤金所说，这是深度优先搜索算法的一个例子。如果您在第 4 行中注意到，它正在使用递归并传递它搜索的第一个子节点：

    `traverse(child);`

并且这条线在父节点中被称为for each child。

更新：为清楚起见添加评论： “一旦它获得“第一个”子节点，它就会再次在该子节点上调用 traverse 函数，迫使系统停止运行，直到它碰到一个节点。”