JavaScript二维数组遍历打印时仅保留子数组首个元素的方法

算力阿峰

2026-8-11

问题

我有如下数据与代码：

dogNames = [[]];

dogNames.push([Bill],[Ben],[jack, Allen],[Barbra],[Jill, Jenny],[George]);

若通过以下循环遍历并打印到控制台：

for(let x=0;x<dogNames.length;x++){
    console.log(dogNames[x]);
}

能否隐藏每个子数组中逗号后的所有值，使打印结果为：

Bill
Ben
Jack
Barbra
Jill
George

即隐藏/移除Allen和Jenny？我不知从何入手，尝试过使用.split()但不清楚如何在二维数组中应用。

解决方案

方法1：遍历直接取子数组第一个元素

你不需要用.split()，这是二维数组结构，每个元素本身就是数组，直接取每个子数组的第一个元素（索引[0]）即可，同时可以修正首字母大小写以匹配预期输出：

修改后的循环代码：

for(let x=0; x<dogNames.length; x++){
    // 跳过初始化时的空数组，避免打印undefined
    if(dogNames[x].length === 0) continue;
    // 取子数组第一个元素，统一首字母大写
    const name = dogNames[x][0].charAt(0).toUpperCase() + dogNames[x][0].slice(1);
    console.log(name);
}

dogNames[x][0]直接定位到每个子数组的第一个元素，自动忽略后续的Allen、Jenny
空数组判断是因为初始的dogNames = [[]]包含一个空数组，跳过它才能得到干净的输出
首字母大写处理是为了让原数组中的jack转换成你需要的Jack

方法2：先预处理数组再遍历

如果想先把原数组转换成只保留每个子数组第一个元素的新数组，再进行打印：

// 过滤空数组，提取每个子数组第一个元素并修正大小写
const filteredDogNames = dogNames
    .filter(subArr => subArr.length > 0)
    .map(subArr => {
        const name = subArr[0];
        return name.charAt(0).toUpperCase() + name.slice(1);
    });

// 遍历打印处理后的数组
filteredDogNames.forEach(name => console.log(name));