javascript 数组显示元素，元素之间用逗号隔开。如何将逗号更改为破折号

Question

我觉得这个问题很愚蠢，但我很好奇我该怎么做。我有一个数组，显示在使用 Svelte 构建的页面中。数组很简单：

let veggie = ["Lettuce", "Tomoato", "Mayo"]

现在当我显示它时，我使用每个块：

{#each veggie as item}
 {item} |
{/each}

这样显示 - 当然 - :

Lettuce,|Tomato,|Mayo|

如何删除逗号 - "," - 并将其替换为 |或任何其他角色？

我尝试使用映射并在前后添加 space，但逗号仍然存在。我不是 js 专家，所以我决定寻求一些 js 忍者的帮助。希望逗号可以被打败。这是我的地图 fn:

let newveggie = veggie.map((el)=>{ return "  " + el + "  "

我可以用逗号显示数组元素 - 没有人会死 - 但我喜欢挑战自己。有解决办法吗？如果是，请与我分享。

Answer 1

我不是一个苗条的人。但是发布一些纯粹的 JavaScript 解决方案。

let string = "" ;
let customSeparator = "|" ;
let veggie = ["Lettuce", "Tomoato", "Mayo"] ;
 veggie.forEach((elm)=>{
   string = string + customSeparator + elm
 })

console.log(string) ;

//another Method

const aStirng = veggie.join(customSeparator)

console.log(aStirng) ;

Answer 2

不确定这是否是您想要的，但您可以试试

veggie.join("-")

Answer 3

这是一个纯粹精巧的简单实现：

<script>
  let veggie = ["Lettuce", "Tomoato", "Mayo"]
</script>

{#each veggie as item, index}
  { index == veggie.length-1 ? item : `${item} | `}
{/each}

REPL

javascript 数组显示元素，元素之间用逗号隔开。如何将逗号更改为破折号

javascript array display elements with a comma between elements. How do I change the comma to a dash

javascript

svelte

svelte-3