jQuery遍历JSON拼接逗号分隔字符串仅返回首个值的解决方法

你在$.each遍历逻辑中，每次迭代都直接对nama_status、jumlah变量做覆盖赋值，没有追加之前遍历得到的内容，循环结束后变量只会保留最后一次遍历的条目，无法得到全量拼接的结果。

推荐用数组收集字段值后统一拼接的写法，逻辑更清晰，也不会出现多余分隔符问题，修改后的完整代码如下：

$.ajax({
    url:'<?= site_url('chartstatus') ?>',
    method:'get',
    success:function(response){
        // 初始化两个数组分别收集状态名称、统计数值
        const namaStatusCollect = [];
        const jumlahCollect = [];
        $.each(response.chartstatus, function(key, value){
            // 处理后的值推入对应数组
            namaStatusCollect.push(`"${value.abs_status.toString()}"`);
            jumlahCollect.push(value.total);
        });
        // 按要求格式拼接为带末尾逗号的字符串
        const nama_status = namaStatusCollect.join(', ') + ',';
        const jumlah = jumlahCollect.join(', ') + ',';
        
        console.log(nama_status);
        console.log(jumlah);
    } 
});

运行后输出结果完全符合预期：

• jumlah输出：12, 5, 1,
• nama_status输出："Bekerja", "Tanpa Keterangan", "Hari Libur",

如果习惯用字符串累加的方式实现，需要注意两个变量初始值要设为空字符串，循环中用+=操作符追加内容，示例如下：

success:function(response){
    let nama_status = '';
    let jumlah = '';
    $.each(response.chartstatus,function(key, value){
        const status = value['abs_status'].toString();
        nama_status += `"${status}", `;
        jumlah += `${value['total']}, `;
    });
    console.log(nama_status);
    console.log(jumlah);
}

这种写法逻辑简单，但最终生成的字符串末尾逗号后会多一个空格，且后续如果需要调整分隔符、过滤空值的话维护成本更高，优先推荐数组收集再拼接的方案。

内容的提问来源于stack exchange，提问作者Habibi