ES6 将数组映射到不带逗号的字符串答案

【问题标题】：ES6 map array to string without commaES6 将数组映射到不带逗号的字符串
【发布时间】：2017-12-08 18:32:59
【问题描述】：

我正在尝试将错误列表映射到我将在工具提示中显示的列表中。添加了列表，但在每个 li 元素之间添加了一个,。

我猜这是因为这最终基本上是errors.map(error => ...).toString()。任何想法如何在不添加此逗号的情况下映射 errors 数组中的字符串？

data-tip = {`
  Precisa de corrigir os seguintes problemas antes de publicar o anúncio:</br>
  <ul>
    ${errors.map(error => `<li>${error}</li>`)}
  </ul>
`}

【问题讨论】：

替换成这个看看：${errors.map(error => <li>${error}</li>)}去掉li的反引号

标签： javascript arrays ecmascript-6

【解决方案1】：

数组对象的.toString() 使用Array.prototype.join 方法将数组转换为字符串。 .join 方法默认使用 , 来连接元素。您可以将.toString() 替换为.join('')。

【讨论】：

除了这篇文章，还要查看.join() doc。

【解决方案2】：

在您的代码中，您使用的是模板文字，它返回一个字符串，因此返回代码

 ${errors.map(error => `<li>${error}</li>`)}

使用toString() 函数转换为字符串，该函数默认将返回的数组与, 连接起来。

您可以将 join 与其他分隔符一起使用，例如

{`
  Precisa de corrigir os seguintes problemas antes de publicar o anúncio:</br>
  <ul>
    ${errors.map(error => `<li>${error}</li>`).join(' ')}
  </ul>
`}

【讨论】：

这里有错误。 .join(' ') 应该在括号内

【解决方案3】：

你可以试试这个方法::

let arrayOfStr = [10, 20, 45, 12, 65 ];

let myNumberOfStr = arrayOfStr.map( number => `myNumber_${number}` ).join(' ');

console.log(myNumberOfStr); 
// "myNumber_10 myNumber_20 myNumber_45 myNumber_12 myNumber_65"

【讨论】：

【解决方案4】：

只需使用reduce。像这样：

data-tip = {`
  Precisa de corrigir os seguintes problemas antes de publicar o anúncio:</br>
  <ul>
    ${errors.reduce(
      (prevError, currentError) => `${prevError}<li>${currentError}</li>`, '',
    )}
  </ul>
`}

【讨论】：