接口返回 [1,2,3],页面要显示成「1,2,3」,有人直接写 String(arr),结果没问题;换成对象数组就傻眼了,页面上刷出一排 [object Object]。
JavaScript 里数组转字符串有好几种写法,用途完全不一样,混着用很容易出 bug。
join 是最好用的那个
arr.join(分隔符) 把每一项拼起来,不传参数默认用逗号,传空串就紧挨着。想拼成 1-2-3,写 arr.join('-')。null 和 undefined 会被当成空字符串,[1, null, 2].join() 得到 1,,2,中间留个空位。toString() 基本等价于 join(),但语义上不如 join 清楚,也改不了分隔符。
const arr = [1, 2, 3];
console.log(arr.join('-')); // 1-2-3
console.log(arr.join('')); // 123
console.log(String(arr)); // 1,2,3对象数组要先 map
直接 join 对象数组,每个对象都会变成 [object Object]。正确做法是先 map 取出需要的字段,再 join。比如用户列表拼名字:users.map(u => u.name).join('、')。多维数组也一样,join 只会降一层,[[1,2],[3,4]].join(';') 得到 1,2;3,4,想彻底摊平先用 flat()。
JSON.stringify 是给接口用的
JSON.stringify(arr) 输出带方括号和引号的字符串,适合存 localStorage、传给后端,不适合直接显示给用户。它会把 undefined、函数丢掉,遇到循环引用直接抛错。调试时想看数组内容,用 console.log 或者 JSON.stringify(arr, null, 2) 格式化,别把它当展示格式。
其他语言顺带一提
Java 里 Arrays.toString(int[]) 输出带方括号的内容,String.join 可以自定义分隔符;Python 用 分隔符.join(列表),但列表元素必须都是字符串,数字要先 map(str, ...)。换语言时别照搬写法,类型检查松紧不一样。
判断标准:给人看的、要自定义分隔符,用 join;要传数据、要保留结构,用 JSON.stringify;只是临时打印,String 也够。对象数组记得先 map,这一步省不掉。