本文介绍如何使用 JavaScript 的 map() 和 join() 方法，将数组中每个对象的 Subject（或其他类似结构）嵌套数组字段，安全、简洁地转换为以逗号分隔的字符串。
本文介绍如何使用 javascript 的 `map()` 和 `join()` 方法，将数组中每个对象的 `subject`（或其他类似结构）嵌套数组字段，安全、简洁地转换为以逗号分隔的字符串。
在处理嵌套数据结构时，常需将数组类型的字段（如 Subject: [{Name: "X"}, {Name: "Y"}]）扁平化为可读性更强的字符串形式（如 "X, Y"）。核心思路是：对原始数组执行 .map() 遍历每个对象，解构出目标字段（如 Subject），再对其内部数组调用 .map() 提取所需属性（如 sub.Name），最后用 .join(', ') 合并为字符串。
以下是完整实现示例：
const data = [
{
"ID": "771276",
"Name": "John",
"Subject": [
{ "Name": "Subject 1" },
{ "Name": "Subject 2" }
]
},
{
"ID": "771277",
"Name": "Mary",
"Subject": [
{ "Name": "Subject 80" }
]
}
];
const result = data.map(({ ID, Name, Subject }) => ({
ID,
Name,
Subject: Array.isArray(Subject)
? Subject.map(sub => sub?.Name ?? '').join(', ')
: ''
}));
console.log(result);
// 输出：
// [
// { "ID": "771276", "Name": "John", "Subject": "Subject 1, Subject 2" },
// { "ID": "771277", "Name": "Mary", "Subject": "Subject 80" }
// ]✅ 关键要点说明：
- 使用对象解构 + 箭头函数提升代码可读性与简洁性；
- 通过 sub?.Name ?? '' 实现安全访问，避免 undefined 或 null 导致运行时错误；
- 添加 Array.isArray(Subject) 判断，增强鲁棒性——若某对象 Subject 字段缺失或非数组，可默认返回空字符串；
- 若需支持更多字段（如 Subject: [{Name: "...", Code: "S1"}]），只需扩展内层 map 的返回值逻辑即可。
该方法不修改原始数据（纯函数式），适用于前端数据预处理、API 响应格式化等典型场景。
