探究 WordPress `Walker` 类的源码：它是如何通过抽象方法 `start_el()` 和 `end_el()` 实现树形结构的遍历。

好嘞，各位观众老爷，咱们今天就来扒一扒 WordPress 里面的 Walker 类，看看它怎么像个老练的导游一样，带着咱们在树形结构的迷宫里左拐右拐的。

第一幕：Walker 类，闪亮登场！

Walker 类，顾名思义，就是个“走路”的类。它专门用来遍历像菜单、分类目录这种层级结构的数据。它本身是个抽象类，所以不能直接拿来用，必须先把它“改造”一下，继承它，然后实现一些特定的方法，才能发挥真正的威力。

为什么要用 Walker 呢？想想看，如果要手动遍历一个多级菜单，那得写多少嵌套循环啊！头都大了。Walker 就像个自动导航仪，能帮你轻松搞定这些复杂的遍历任务。

第二幕：核心方法，粉墨登场！

Walker 类里最核心的两个方法，就是 start_el() 和 end_el()。这两个方法就像演出中的“开场白”和“谢幕”，分别在遍历到每个节点（element）的时候被调用。

• start_el()： 在遍历到树形结构中的一个节点时，这个方法会被调用。它负责输出这个节点的“开场白”，也就是节点开始的 HTML 代码。比如，如果是菜单项，那可能就要输出 <li class="menu-item">。

• end_el()： 在遍历完一个节点的所有子节点后，这个方法会被调用。它负责输出这个节点的“谢幕”，也就是节点结束的 HTML 代码。比如，如果是菜单项，那可能就要输出 </li>。

这两个方法接收的参数非常重要，它们包含了节点的所有信息，你可以根据这些信息来定制输出的内容。

第三幕：代码示例，有图有真相！

光说不练假把式，咱们来个实际的例子，看看怎么用 Walker 来定制菜单的输出。

class My_Custom_Walker extends Walker_Nav_Menu {

    public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
        $indent = ( $depth ) ? str_repeat( "t", $depth ) : '';

        $classes = empty( $item->classes ) ? array() : (array) $item->classes;
        $classes[] = 'menu-item-' . $item->ID;

        // 添加自定义的class
        $classes[] = 'my-custom-class';

        $args = apply_filters( 'nav_menu_item_args', $args, $item, $depth );

        $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args, $depth ) );
        $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : '';

        $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args, $depth );
        $id = $id ? ' id="' . esc_attr( $id ) . '"' : '';

        $output .= $indent . '<li' . $id . $class_names .'>';

        $atts = array();
        $atts['title']  = ! empty( $item->attr_title ) ? $item->attr_title : '';
        $atts['target'] = ! empty( $item->target )     ? $item->target     : '';
        $atts['rel']    = ! empty( $item->xfn )        ? $item->xfn        : '';
        $atts['href']   = ! empty( $item->url )        ? $item->url        : '';

        $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args, $depth );

        $attributes = '';
        foreach ( $atts as $attr => $value ) {
            if ( ! empty( $value ) ) {
                $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value );
                $attributes .= ' ' . $attr . '="' . $value . '"';
            }
        }

        $title = apply_filters( 'the_title', $item->title, $item->ID );

        $title = apply_filters( 'nav_menu_item_title', $title, $item, $args, $depth );

        $item_output = $args->before;
        $item_output .= '<a'. $attributes .'>';
        $item_output .= $args->link_before . $title . $args->link_after;
        $item_output .= '</a>';
        $item_output .= $args->after;

        $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
    }

    public function end_el( &$output, $item, $depth = 0, $args = array() ) {
        $output .= "</li>n";
    }
}

这个例子里，我们继承了 Walker_Nav_Menu 类，这是 WordPress 专门用来处理菜单的 Walker 类。我们在 start_el() 方法里，给每个菜单项的 <li> 标签添加了一个自定义的 class my-custom-class。在 end_el() 方法里，我们简单地输出了 </li> 标签。

第四幕：display_element() 和 walk()，幕后英雄！

除了 start_el() 和 end_el()，Walker 类还有两个重要的幕后英雄：display_element() 和 walk()。

• display_element()： 这个方法负责决定是否显示一个节点。它可以根据节点的属性（比如是否是当前页面的链接）来决定是否跳过这个节点。

• walk()： 这个方法才是真正执行遍历的“指挥官”。它会递归地遍历整个树形结构，并根据需要调用 start_el()、end_el() 和 display_element() 方法。

虽然我们通常不需要直接修改 display_element() 和 walk() 方法，但是了解它们的工作原理，能帮助我们更好地理解 Walker 类的工作流程。

第五幕：参数大揭秘，知己知彼！

start_el() 和 end_el() 方法接收的参数非常丰富，下面咱们来逐一揭秘：

参数	类型	描述
$output	string	引用传递的字符串，用于存储输出的 HTML 代码。
$item	object	当前遍历的节点对象。包含了节点的所有信息，比如 ID、标题、链接、class 等等。
$depth	int	当前节点的深度。根节点的深度为 0，子节点的深度依次递增。
$args	object	一个包含各种参数的对象，可以用来定制输出的格式。
$id	int	(仅在 start_el() 中) 当前节点的 ID。

这些参数就像工具箱里的各种工具，你可以根据需要选择合适的工具来定制输出。

第六幕：过滤器，自由定制！

WordPress 提供了很多过滤器，可以让我们在 Walker 类的各个环节进行定制。比如：

• nav_menu_css_class： 可以用来修改菜单项的 CSS class。
• nav_menu_link_attributes： 可以用来修改菜单链接的 HTML 属性。
• walker_nav_menu_start_el： 可以用来修改 start_el() 方法的输出结果。

利用这些过滤器，我们可以轻松地实现各种定制需求，而不需要修改 Walker 类的源代码。

第七幕：实战演练，更上一层楼！

咱们再来个稍微复杂一点的例子，这次咱们要给当前页面的菜单项添加一个特殊的 class current-menu-item。

class My_Custom_Walker extends Walker_Nav_Menu {

    public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
        global $post;

        $indent = ( $depth ) ? str_repeat( "t", $depth ) : '';

        $classes = empty( $item->classes ) ? array() : (array) $item->classes;
        $classes[] = 'menu-item-' . $item->ID;

        // 判断是否是当前页面
        if ( $post && $item->object_id == $post->ID && $item->object == 'page' ) {
            $classes[] = 'current-menu-item';
        }

        $args = apply_filters( 'nav_menu_item_args', $args, $item, $depth );

        $class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args, $depth ) );
        $class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : '';

        $id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args, $depth );
        $id = $id ? ' id="' . esc_attr( $id ) . '"' : '';

        $output .= $indent . '<li' . $id . $class_names .'>';

        $atts = array();
        $atts['title']  = ! empty( $item->attr_title ) ? $item->attr_title : '';
        $atts['target'] = ! empty( $item->target )     ? $item->target     : '';
        $atts['rel']    = ! empty( $item->xfn )        ? $item->xfn        : '';
        $atts['href']   = ! empty( $item->url )        ? $item->url        : '';

        $atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args, $depth );

        $attributes = '';
        foreach ( $atts as $attr => $value ) {
            if ( ! empty( $value ) ) {
                $value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value );
                $attributes .= ' ' . $attr . '="' . $value . '"';
            }
        }

        $title = apply_filters( 'the_title', $item->title, $item->ID );

        $title = apply_filters( 'nav_menu_item_title', $title, $item, $args, $depth );

        $item_output = $args->before;
        $item_output .= '<a'. $attributes .'>';
        $item_output .= $args->link_before . $title . $args->link_after;
        $item_output .= '</a>';
        $item_output .= $args->after;

        $output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
    }

    public function end_el( &$output, $item, $depth = 0, $args = array() ) {
        $output .= "</li>n";
    }
}

在这个例子里，我们首先获取了全局的 $post 对象，然后判断当前菜单项的 object_id 是否等于 $post->ID，并且 object 是否为 ‘page’。如果条件成立，就给这个菜单项添加 current-menu-item class。

第八幕：注意事项，避免踩坑！

在使用 Walker 类的时候，有一些地方需要特别注意，避免踩坑：

• 引用传递： start_el() 和 end_el() 方法的第一个参数 $output 是引用传递的。这意味着你修改 $output 的值，会直接影响最终的输出结果。
• 转义： 在输出 HTML 代码的时候，一定要注意转义，避免 XSS 攻击。可以使用 esc_attr()、esc_url() 等函数来进行转义。
• 过滤器： 尽量使用过滤器来进行定制，而不是直接修改 Walker 类的源代码。这样可以更好地保持代码的兼容性和可维护性。
• 调试： 如果发现输出结果不符合预期，可以使用 var_dump()、error_log() 等函数来进行调试，看看各个变量的值是否正确。

第九幕：Walker 家族，人丁兴旺！

除了 Walker_Nav_Menu，WordPress 还提供了其他一些 Walker 类，比如：

• Walker_Category： 用来遍历分类目录。
• Walker_CategoryDropdown： 用来生成分类目录的下拉列表。
• Walker_Comment： 用来遍历评论。

这些 Walker 类都继承自 Walker 类，并根据各自的特点进行了定制。

第十幕：总结，落幕撒花！

Walker 类是 WordPress 里一个非常强大的工具，它可以帮助我们轻松地遍历树形结构的数据，并定制输出的格式。掌握了 Walker 类，你就掌握了 WordPress 主题开发的一项重要技能。

希望今天的讲座能帮助大家更好地理解 Walker 类的工作原理。如果有什么问题，欢迎随时提问。咱们下期再见！