JavaScript中使用forEach遍历数组，如何生成空格分隔的分类字符串

嘿，这个需求其实很好实现，我给你推荐几种实用的方法：

方法1：用map() + join()（最简洁优雅） #

这是JavaScript处理这类数组元素提取拼接最常用的方式，代码量少且可读性高：

const items = [
  {id: "805", category: 'Apple'},
  {id: "804", category: 'Watermelon'},
  {id: "804", category: 'Plum'}
];

// 先提取所有category到新数组，再用空格拼接
const result = items.map(item => item.category).join(' ');
console.log(result); // 输出：Apple Watermelon Plum

原理很简单：map()遍历数组，把每个对象的category值提取出来，生成一个纯字符串数组['Apple', 'Watermelon', 'Plum']；接着join(' ')会用空格作为分隔符，把数组里的元素拼接成完整字符串，完全符合你的需求。

方法2：修改forEach逻辑（如果一定要用forEach） #

如果你坚持想用forEach来实现，可以利用它的第二个参数index（当前元素的索引）来控制空格的添加：

const items = [
  {id: "805", category: 'Apple'},
  {id: "804", category: 'Watermelon'},
  {id: "804", category: 'Plum'}
];

let result = '';
items.forEach((item, index) => {
  // 不是第一个元素的话，先加空格
  if (index !== 0) {
    result += ' ';
  }
  result += item.category;
});
console.log(result); // 输出：Apple Watermelon Plum

这样做的好处是不会在字符串开头或结尾产生多余的空格，逻辑也很清晰。

方法3：先拼接再去空格（不推荐，仅作参考） #

还有一种偷懒的方式，先给每个category后面加空格，最后用trim()去掉末尾的空格，但这种方式如果你的category本身包含首尾空格的话，可能会误删，所以谨慎使用：

const items = [
  {id: "805", category: 'Apple'},
  {id: "804", category: 'Watermelon'},
  {id: "804", category: 'Plum'}
];

let result = '';
items.forEach(item => {
  result += item.category + ' ';
});
// 去掉首尾多余的空格
result = result.trim();
console.log(result); // 输出：Apple Watermelon Plum

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