在音乐类应用场景中,将歌曲按照首字母分组并以双列形式展示是常见需求,合理的PHP处理逻辑可以避免重复代码,提升开发效率。下面通过完整的实现流程讲解具体方法。

数据准备
首先假设我们有一组歌曲数据,每首歌曲包含名称和对应的首字母,数据结构如下:
<?php
// 模拟歌曲数据,实际场景中可以从数据库查询获取
$songs = [
['name' => '爱你', 'first_letter' => 'A'],
['name' => '北京欢迎你', 'first_letter' => 'B'],
['name' => '成都', 'first_letter' => 'C'],
['name' => '东风破', 'first_letter' => 'D'],
['name' => '饿狼传说', 'first_letter' => 'E'],
['name' => '浮夸', 'first_letter' => 'F'],
['name' => '光辉岁月', 'first_letter' => 'G'],
['name' => '后来', 'first_letter' => 'H'],
['name' => '江南', 'first_letter' => 'J'],
['name' => '卡路里', 'first_letter' => 'K'],
];
?>
按字母分组处理
第一步需要将歌曲按照first_letter字段进行分组,避免重复编写分组逻辑,使用PHP内置的数组函数完成处理:
<?php
// 初始化分组数组
$grouped_songs = [];
// 遍历歌曲数据完成分组,无需重复判断逻辑
foreach ($songs as $song) {
$letter = $song['first_letter'];
if (!isset($grouped_songs[$letter])) {
$grouped_songs[$letter] = [];
}
$grouped_songs[$letter][] = $song['name'];
}
// 按照字母顺序排序分组结果
ksort($grouped_songs);
?>
双列数据拆分
为了实现双列展示,需要将分组后的数据拆分为左列和右列,这里通过统一的计算逻辑处理,避免重复代码:
<?php // 获取所有分组的字母 $letters = array_keys($grouped_songs); // 计算总分组数 $total_groups = count($letters); // 计算左列和右列的分组数量,双列均分,奇数时左列多一个 $left_count = ceil($total_groups / 2); $right_count = $total_groups - $left_count; // 拆分左列和右列的分组数据 $left_groups = array_slice($grouped_songs, 0, $left_count, true); $right_groups = array_slice($grouped_songs, $left_count, $right_count, true); ?>
前端渲染实现
最后通过统一的循环逻辑渲染左右两列的歌曲分组,不需要为左右列编写重复的HTML生成代码:
<div class="song-container" style="display: flex; gap: 20px;">
<?php
// 定义渲染分组的函数,避免重复编写渲染逻辑
function render_song_group($groups) {
foreach ($groups as $letter => $song_list) {
echo '<div class="letter-group" style="margin-bottom: 20px;">';
echo '<h3 style="margin: 0 0 10px 0; font-size: 16px;">' . $letter . '</h3>';
echo '<ul style="margin: 0; padding-left: 20px; list-style: disc;">';
foreach ($song_list as $song_name) {
echo '<li style="margin-bottom: 5px;">' . $song_name . '</li>';
}
echo '</ul>';
echo '</div>';
}
}
// 渲染左列
echo '<div class="left-column" style="flex: 1;">';
render_song_group($left_groups);
echo '</div>';
// 渲染右列
echo '<div class="right-column" style="flex: 1;">';
render_song_group($right_groups);
echo '</div>';
?>
</div>
逻辑优化说明
上述实现中,核心的优化点在于:
- 分组逻辑只用了一个循环完成,没有重复的分组判断代码
- 双列拆分通过数组切片函数统一处理,适配任意数量的分组
- 渲染逻辑封装为函数,左右列调用同一个函数,避免重复的HTML生成代码
如果需要调整双列的样式或者分组的展示规则,只需要修改render_song_group函数即可,不需要同时修改左右两处的代码,符合零代码重复的设计要求。