如何在JavaScript中按字母顺序将字符串数组拆分为多组子数组？

嘿，这个按首字母分组字符串数组的需求挺常见的，咱们用JavaScript的reduce方法就能优雅搞定，它特别适合这种需要累积处理的分组场景。下面是完整的实现代码，还有详细的说明：

const array = ['cheese', 'corn', 'apple', 'acorn', 'beet', 'banana', 'yam', 'yucca'];

// 用reduce方法完成分组
const groupedData = array.reduce((result, currentItem) => {
    // 获取当前元素的首字母，转小写确保不区分大小写（需要区分的话去掉toLowerCase即可）
    const firstChar = currentItem[0].toLowerCase();
    // 如果当前首字母的分组不存在，就创建一个空数组
    if (!result[firstChar]) {
        result[firstChar] = [];
    }
    // 将当前元素加入对应分组
    result[firstChar].push(currentItem);
    // 可选：给每个分组内的元素按字母排序，让结果更规整
    result[firstChar].sort();
    return result;
}, {}); // 初始值是一个空对象，用来存储最终的分组结果

console.log(groupedData);

代码细节说明 #

• reduce核心逻辑：以空对象作为初始容器，遍历数组时把每个元素归类到对应的首字母分组里，一步步累积出最终的分组结果。
• 首字母处理：toLowerCase()是为了避免大小写导致的重复分组（比如"Apple"和"apple"会被分到同一组），如果你的需求是严格区分大小写，直接去掉这个方法就行。
• 分组排序：调用sort()可以让每个分组内的元素也按字母顺序排列，要是不需要这一步，删掉该行代码即可。

最终输出结果 #

运行代码后，groupedData的结构和你期望的一致：

{
  a: ['apple', 'acorn'],
  b: ['banana', 'beet'],
  c: ['cheese', 'corn'],
  y: ['yam', 'yucca']
}

额外小技巧 #

如果需要把分组结果拆成单独的变量（就像你示例里的a、b那样），可以用解构赋值快速实现：

const { a, b, c, y } = groupedData;
console.log(a); // 输出: ['apple', 'acorn']

内容的提问来源于stack exchange，提问作者Christopher R.